Typography
Check out below text utilities.
Heading text
For heading u can use h1, h2, h3, h4, h5, h6 elements.
The same font-styling is present for class names h1, h2, h3,
h4,
h5, h6 class.
H1-Heading
H2-Heading
H3-Heading
H4-Heading
H5-Heading
H6-Heading
Paragraph text
For paragraph u can use p element along with given class.
P-Paragraph-body-copy-large
P-Paragraph-body-copy-regular style
P-Paragraph-body-copy-medium
P-Paragraph-body-copy-small
Align text
To align the text add text-center, text-left, text-right
class to wrapper element
H4-Heading Text Align Center
H5-Heading Text Align left
H6-Heading Text Align right
Extra styles
- You can use the mark tag to highlight text. Add text-mark class to mark tag
- To strike-through the text, add text-strike-through class
- To make text bold (weight: 700), add text-bold-weight class
- To make text small in size, add text-small-size class
- To make text color change there are two class, add one of the classes primary-text-color, secondary-text-color
You can use the mark tag to highlight text.
This line of text is meant to be treated as no longer accurate.
Text with bold font weight
Small size text
Text with primary-color
Text with secondary-color