Theme

npm_versionnpm Paragon package page

Typography


Headings

DesktopMobileCSS Class

Heading 1

 

Heading 1

 

.h1

Heading 2

 

Heading 2

 

.h2

Heading 3

 

Heading 3

 

.h3

Heading 4

 

Heading 4

 

.h4

Heading 5

 

Heading 5

 

.h5

Heading 6

 

Heading 6

 

.h6

Heading Label

 

Heading Label

 

.heading-label

Body

Desktop & MobileCSS Class

Large Body

 

.lead

Body

 

Small Body

 

.small

Extra Small Body

 

.x-small

Micro Body

 

.micro

Display

DesktopMobileCSS Class

Display 1

 

Display 1

 

.display-1

Display 2

 

Display 2

 

.display-2

Display 3

 

Display 3

 

.display-3

Display 4

 

Display 4

 

.display-4

Links

ExampleDescription

An inline link in a sentence.

For links inside a p or with the .inline-link class name.

Muted, Standalone Link

.muted-link not in a p tag.

An muted, inline link in a sentence.

For .muted-link links inside a p or with the .inline-link class name.

Decoration and Emphasis

StyleCSS Class

Lowercase text.

.text-lowercase

uppercase text.

.text-uppercase

capitalize text.

.text-capitalize

No decorations.

.text-decoration-none

Italic text.

.font-italic

Bold text.

.font-weight-bold

Regular text.

.font-weight-normal

Alignment

StyleCSS Class

left text.

.text-left

right text.

.text-right

center text.

.text-center

The text-justify class specifies the justification method of text. This text-justify class spreads the words into the complete line with equal spaces.

.text-justify

Use text-wrap to cause text to wrap normally within an element. Newlines and spaces will be collapsed.

.text-wrap

Use text-nowrap to prevent text from wrapping within an element. Newlines and spaces will be collapsed. You can prevent line breaks and text wrapping for specific elements

.text-nowrap

Contents