TYPOGRAPHY
Typography is the style or appearance of text. It can also refer to the
art of working with text something you probably do all the time. To import the entire component into
your project import the below stylesheet into your project.
Default font family: "Roboto".
Default font family: "Roboto".
@import url("https://oxygen-ui-component-library.netlify.app/components/text/text.css");
-
HeadingsOxygen UI provides 6 levels of headings which can be used for the titles or sub-titles. Use the classname
heading-1(3.5rem),heading-2(3rem),heading-3(2.5rem),heading-4(2rem),heading-5(1.5rem) andheading-6(1rem).Component
Component
Component
Component
Component
Component
<div class="text-heading p-2"> <h1 class="heading-1">Component Library</h1> <h2 class="heading-2">Component Library</h2> <h3 class="heading-3">Component Library</h3> <h4 class="heading-4">Component Library</h4> <h5 class="heading-5">Component Library</h5> <h6 class="heading-6">Component Library</h6> </div> -
Gray TextThis is used to display the information in gray. Use the classname
gray-textto get your text in gray.Component Library
<div class="box-shadow p-2"> <p class="gray-text text">Component Library</p> </div> -
Centered TextThis is used to display the information at the center of the container. Use the classname
centered-textto get your text aligned to the center of the container.Component Library
<div class="box-shadow p-2"> <p class="centered-text text">Component Library</p> </div>