Structures

main-wrapper

page-wrapper

Container sm

Container md

Container lg

Padding Global

Padding section sm

Padding section md

Padding section lg

Padding section lg

Heading Base

Heading 1 - 2xl - Medium

Heading 1 - 2xl - Reg

Heading 2 - xl - Medium

Heading 2 - xl - Reg

Heading 3 - lg - Medium

Heading 3 - lg - Reg

Heading 4 - md - Medium

Heading 4 - md - Reg

Heading 5 - sm - Medium
Heading 5 - sm - Reg
Heading 6 - xs - Medium
Heading 6 - xs - Reg

Heading Style

Heading 1 - 2xl - Medium

Heading 2 - xl - Medium

Heading 3 - lg - Medium

Heading 4 - md - Medium

Heading 5 - sm - Medium
Heading 6 - xs - Medium

Text Sizes

Text 2xl SemiBold

Text 2xl Medium

Text 2xl Regular

Text xl SemiBold

Text xl Medium

Text xl Regular

Text lg SemiBold

Text lg Medium

Text lg Regular

Text md SemiBold

Text md Medium

Text md Regular

Text sm SemiBold

Text sm Medium

Text sm Regular

Text xs SemiBold

Text xs Medium

Text xs Regular

Text Weights

Text Weight Semibold

Text Weight Medium

Text Weight Regular

Labels

label 2xl

label xl

label lg

label md

label sm

label xs

Paragraphs

Paragraph 2xl

Paragraph xl

Paragraph lg

Paragraph md

Paragraph sm

Paragraph xs

Buttons

Submit Form

Button Primary

Submit Form

Button Secondary

Submit Form

Button Subtle

Default Text

Button Secondary + Icon

Submit Form

Button Subtle Icon

Default Text

Button Primary+ Icon Dark

Submit Form

Button Secondary + Icon Dark

Tags

Figma Templates

Tag md Default

Figma Templates

Tag md Outlined

Figma Templates

Tag smDefault

Colors

Background Color

SH Black

Gray 100

Gray 90

Gray 80

Gray 70

Gray 60

Gray 50

Gray 40

Gray 30

Gray 20

Gray 10

SH White

Text Color

Text Color Black

Text Color Gray 100

Text Color Gray 90

Text Gray 80

Text Gray 70

Text Color Gray 60

Text Color Gray 50

Text Color Gray 40

Text Color Gray 30

Text Color Gray 20

Text Color Gray 10

Text Color Black

Paddings

Direction

Padding Bottom

Padding Top

Padding Left

Padding Right

Padding Horizontal

Padding Vertical

Size

Padding 0

Padding 2xs

Padding xs

Padding sm

Padding md

Padding lg

Padding xl

Padding 2xl

Margins

Direction

Margin Bottom

Margin Top

Margin Left

Margin Right

Margin Horizontal

Margin Vertical

Size

Margin 0

Margin 2xs

Margin xs

Margin sm

Margin md

Margin lg

Margin xl

Margin 2xl

Spacers

Icons

Utility / Misc

Hide

Text Style Link

Fragments

Promo/Announcement Strip

🎁 We're having a 50% OFF Grand Launch Sale! Make sure to enter “SPIRALPOWER50” on the checkout page! 🎁

Text Align Center

Text Align left

Text Align Right