Style Guide

Pro-tips: Paste this content into a dedicated page named “Style guide”. Convert each color style below to variables so they can be used in text, borders, backgrounds, and gradients. To do this, select a color style element, navigate to the Style panel on the right and add it as a variable by clicking the purple dot next to a color property.

Text styles

Lorem ipsum dolor

DM Sans Bold 64px/83.2px

Lorem ipsum dolor

DM Sans Bold 48px/62.4px

Lorem ipsum dolor

DM Sans Bold 32px/41.6px

Lorem ipsum dolor

DM Sans Bold 24px/36px

Lorem ipsum dolor

DM Sans Bold 21px/32px

Lorem ipsum dolor

DM Sans Regular 21px/32px

Lorem ipsum dolor

DM Sans Bold 18px/27px

Lorem ipsum dolor

DM Sans Regular 18px/27px

Lorem ipsum dolor

DM Sans Regular 16px/24px

Lorem ipsum dolor

DM Sans Regular 14px/21px

Lorem ipsum dolor

DM Sans Bold 16px/NaNpx

Color styles

High_emphasys - #000000

Medium_emphasys - #000000

Low_emphasys - #000000

Primary - #FF4500

Secondary - #5909A8

Secondary_dark - #31075A

Background - #FBFAFA

High_emphasys_inverse - #FFFFFF

Medium_emphasys_inverse - #FFFFFF

Low_emphasys_inverse - #FFFFFF

Color styles

Tag text