Styleguide

Typography

H1 TITLE EXAMPLE

H2 Title Example

H3 Title Example

H4 Title Example

H5 Title Example

Subtitle

Sub-title Example - Base

Sub-title Example - Small

Sub-title Example - Large


Paragraph

Paragraph text example: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer tempor sem eu. - Base

Paragraph text example: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer tempor sem eu. - Small

Paragraph text example: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer tempor sem eu. - Large

Paragraph text example: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer tempor sem eu. - X-Large


Links

Links

Buttons

Primary (Base)

Button

Disabled Primary

Button Small

Button Large

Secondary

Button Secondary

Disabled Secondary

Button Small

Button Large

Tertiary

Button Tertiary

Disabled Tertiary

Button Small

Button Large


Badges

Default Out of Stock Sale $100 Off

Form Elements

Contact Form

FAQs

Question

Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt. Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt.

  • Dot points to be included

Bold, ect rich text.

Question

Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt. Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt.

  • Dot points to be included

Bold, ect rich text.

Question

Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt. Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt.

  • Dot points to be included

Bold, ect rich text.

Question

Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt. Lorem ipsum dolor sit amet, consectetur adipiing elit. Integer tempor sem eu nibh rutrum, ut nisl tristique. Donec viverra arcu dignissim varius tincidunt.

  • Dot points to be included

Bold, ect rich text.

Tabs