Display 1 Like This
font-size 70px 5.5rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
font-size 52px 3.25rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
Display 2 Like This
font-size 60px 5.125rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
font-size 45px 3rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
Display 3 Like This
font-size 40px 4.75rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
font-size 37px 2.875rem letter-spacing-heading 0.0325rem line-height-heading 1 used for display 1-3
Heading 1 Like This
font-size50px 4.5remletter-spacing-heading 0.0325rem line-height-subheading1used for headings 1-6
font-size35px 2.75rem letter-spacing-heading 0.0325rem line-height-heading1used for display 1-3
Heading 2 Like This
font-size45px4.25remletter-spacing-heading0.0325remline-height-subheading1used for headings 1-6
font-size32px2.625remletter-spacing-heading0.0325remline-height-heading1used for display 1-3
Heading 3 Like This
font-size40px3.875remletter-spacing-heading0.0325remline-height-subheading1used for headings 1-6
font-size30px2.5remletter-spacing-heading0.0325remline-height-heading1used for display 1-3
Heading 4 Like This
font-size35px3.625remletter-spacing-heading0.0325remline-height-subheading1used for headings 1-6
font-size27px2.375remletter-spacing-heading0.0325remline-height-heading1used for display 1-3
Heading 5 Like This
font-size30px3.25remletter-spacing-heading0.0325remline-height-subheading1used for headings 1-6
font-size25px2.25remletter-spacing-heading0.0325remline-height-heading1used for display 1-3
Heading 6 Like This
font-size25px2.875remletter-spacing-heading0.0325remline-height-subheading1used for headings 1-6
font-size24px2.125remletter-spacing-heading0.0325remline-height-heading1used for display 1-3
Font Size Body 100 This is paragraph text which should be used for the majority of all text content on the page. Inline links, which look like this, may be added to paragraph text using the link icon.
Body 400 Like This
Body 350 Like This
Body 300 Like This
Body 250 Like This
Body 200 Like This
Body 150 Like This
Body 100 Like This
Body 75 Like This
Body 60 Like This
Body 50 Like This
Body 25 Like This
Body 20 Like This
primary button (fill)
secondary button (outline)
primary text link
secondary text LINK
Inline Text Link
Need extra help? Talk to us at example@patagoniaprovisions.com
global theme Colors
general
background
#ffffff
used for page background
body copy text
#232323
lines and borders
#72746D
link
#1E4933
used for inline links
link hover
#0023DC
used for inline links
header
background
#ffffff
text
#1E4933
footer
background
#1E4933
text
#ffffff
primary-button-color
button-color
#1E4933
text
#ffffff
hover
#153324
disabled
#9C9C9C
secondary-button-color
button-color
#7BC124
button-text
#1E4933
Hover
#A3D466
disabled
#9C9C9C
Product
sale-price
#1E4933
in-stock
#7BC124
low-in-stock
#FDB52B
out-of-stock
#DB2828
additional colors
Brand Colors
sand
#EEEBE2
Medium Light Green
#245C39
brand green
#1E4933
iconography
Rules/lines/dividers
Radio button
checkbox
Play/Pause Buttons
Featured collection
