Heading Styles

Heading 1 (extrabold)

Heading 2 (semibold)

Heading 3 (semibold)

Heading 4 (semibold)

Font Weights

This text is thin (font-thin)

This text is extra light (font-extralight)

This text is light (font-light)

This text is normal (font-normal)

This text is medium (font-medium)

This text is semibold (font-semibold)

This text is bold (font-bold)

This text is extrabold (font-extrabold)

This text is black (font-black)

Text Sizes

Extra Small Text (text-xs)

Small Text (text-sm)

Base Text (text-base)

Large Text (text-lg)

Extra Large Text (text-xl)

2XL Text (text-2xl)

3XL Text (text-3xl)

4XL Text (text-4xl)

5XL Text (text-5xl)

Text Styles

Regular paragraph text with bold, medium, and normal weights.

This is a lead paragraph with muted color.

This is a blockquote with italic styling and a left border.

Here is an example of inline code styling.

Font Styles

This text is italic (italic)

This text is not italic (not-italic)

This text is underlined (underline)

This text has strikethrough (line-through)

This text is uppercase (uppercase)

This Text Is Lowercase (lowercase)

this text is capitalized (capitalize)

Text Alignment

Left aligned text (text-left)

Center aligned text (text-center)

Right aligned text (text-right)

Justified text that spreads across the entire width of the container. This example shows how justified text works. (text-justify)