Typography
Fonts
Space grotesk
Headings
Geist
Body
Headings
Element
Element
Element
Element
Body
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
- Example Ordered List
- Example Ordered List
- Example Unordered List
- Example Unordered List
Color
Background
Primary
Black
Dark Gray
Mid Gray
Light Gray
White
Text
Primary
Black
Dark Gray
Mid Gray
Light Gray
White
Components
Buttons
Default
Default + Icon Right
Default + Icon Left
Secondary
Secondary + Icon Right
Secondary + Icon Left
Default Light
Default Light + Icon Right
Default Light + Icon Left
Secondary Light
Secondary Light + Icon Right
Secondary Light + Icon Left
Teritiary
Tertiary + Icon Right
Teritiary + Icon Right
Tertiary Light
Tertiary Light
Tertiary Light
Text Link
Text Link Light
Forms
Thank you for your submission!
Thank you for your submission!
Card
Default
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Rich Text
Heading 1
Heading 2
Heading 3
Heading 4
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. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Block quote (same font size as paragraph-1.25)
Ordered list
- Item 1
- Item 2
- Item 3
Unordered list
- Item A
- Item B
- Item C
Bold text
Emphasis
Inline code
Superscript
Subscript
Prevent Style Clean Up
This is where you can store elements and classes used in custom code to prevent their classes/styles from being cleaned up.