Hello worldHello world

Components

Content Wrap

Content Wrap

Lorem ipsum

Quisque faucibus ex sapien vitae pellentesque sem placerat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

.content-wrap

Multiple properties - Vertical Align Left

.content-wrap

.is--center

Multiple properties - Vertical Align Center

.content-wrap

.is--right

Multiple properties - Vertical Align Right

.content-wrap

.is--stretch

Multiple properties - Vertical Align Stretch

.content-wrap

.is--gap-xxs

Gap: 0.5rem;

.content-wrap

.is--gap-xs

Gap: 1rem;

.content-wrap

.is--gap-sm

Gap: 1.5rem;

.content-wrap

.is--gap-md

Gap: 2rem;

.content-wrap

.is--gap-lg

Gap: 3rem;

.content-wrap

.is--gap-xl

Gap: 4rem;

.content-wrap

.is--gap-xxl

Gap: 5rem;

Eyebrow

Eyebrow

Lorem ipsum

Heading

Heading

Inherit

Est consequatur natus et dicta impedit eum earum magnam.

Heading

Display

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H1

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H2

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H3

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H4

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H5

Est consequatur natus et dicta impedit eum earum magnam.

Heading

H6

Est consequatur natus et dicta impedit eum earum magnam.

Rich Text

Rich Text

Paragraph XL

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Rich Text

Paragraph LG

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Rich Text

Inherit

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Rich Text

Paragraph SM

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Rich Text

Paragraph XS

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Plain Text

Plain Text

Paragraph XL

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Plain Text

Paragraph LG

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Plain Text

Inherit

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Plain Text

Paragraph SM

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Plain Text

Paragraph XS

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Links

a

data-underline-link

a

data-underline-link="alt"

Buttons

Button

Button Scroll

Badges

Badge

Badge

Icons

Icon

Inherit

1 EM

Icon

SM

SM

Icon

MD

MD

Icon

LG

LG

Images

Image

Inherit

Landscape (4:3)

Landscape (3:2)

Widescreen (16:9)

Portrait (3:4)

Portrait (9:16)

Square (1:1)

Custom

Background

Spacers

Section Spacer

Tiny

Small

Medium

Main

Large

Huge

Massive

Spacer

Gap XXS

Gap XS

Gap SM

Gap MD

Gap LG

Gap XL

Gap XXL

Borders

Border