Colors
brand 1#799a05 SL
SL
SL
SL
SL
SL
SL
SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand1} ${colors.brand1Alt} ${colors.brand1AltDark} ${colors.brand1AltDarker} ${colors.brand1AltDarkest} ${colors.brand1AltLight} ${colors.brand1AltLighter} ${colors.brand1AltLightest} ${colors.brand1Dark} ${colors.brand1Darker} ${colors.brand1Darkest} ${colors.brand1Light} ${colors.brand1Lighter} ${colors.brand1Lightest}
brand 1Alt#4F5B31 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand1Alt} ${colors.brand1AltDark} ${colors.brand1AltDarker} ${colors.brand1AltDarkest} ${colors.brand1AltLight} ${colors.brand1AltLighter} ${colors.brand1AltLightest}
brand 2#f28b00 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand2} ${colors.brand2Dark} ${colors.brand2Darker} ${colors.brand2Darkest} ${colors.brand2Light} ${colors.brand2Lighter} ${colors.brand2Lightest}
brand 3#4D5A31 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand3} ${colors.brand3Dark} ${colors.brand3Darker} ${colors.brand3Darkest} ${colors.brand3Light} ${colors.brand3Lighter} ${colors.brand3Lightest}
brand 4#58585B SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand4} ${colors.brand4Dark} ${colors.brand4Darker} ${colors.brand4Darkest} ${colors.brand4Light} ${colors.brand4Lighter} ${colors.brand4Lightest}
brand 5#F1F1F2 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand5} ${colors.brand5Dark} ${colors.brand5Darker} ${colors.brand5Darkest} ${colors.brand5Light} ${colors.brand5Lighter} ${colors.brand5Lightest}
brand 6#633511 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand6} ${colors.brand6Dark} ${colors.brand6Darker} ${colors.brand6Darkest} ${colors.brand6Light} ${colors.brand6Lighter} ${colors.brand6Lightest}
black#000000 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.black} ${colors.blackDark} ${colors.blackDarker} ${colors.blackDarkest} ${colors.blackLight} ${colors.blackLighter} ${colors.blackLightest}
neutral#EEEEEE SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.neutral} ${colors.neutralDark} ${colors.neutralDarker} ${colors.neutralDarkest} ${colors.neutralLight} ${colors.neutralLighter} ${colors.neutralLightest}
white#FFFFFF SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.white} ${colors.whiteDark} ${colors.whiteDarker} ${colors.whiteDarkest} ${colors.whiteLight} ${colors.whiteLighter} ${colors.whiteLightest}
body#4B4C49 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.body} ${colors.bodyDark} ${colors.bodyDarker} ${colors.bodyDarkest} ${colors.bodyLight} ${colors.bodyLighter} ${colors.bodyLightest}
border#EEEDED SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.border} ${colors.borderDark} ${colors.borderDarker} ${colors.borderDarkest} ${colors.borderLight} ${colors.borderLighter} ${colors.borderLightest}
errorred SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.error} ${colors.errorDark} ${colors.errorDarker} ${colors.errorDarkest} ${colors.errorLight} ${colors.errorLighter} ${colors.errorLightest}
Typography
Sans Serif
Value: myriad-pro, sans-serif
Variable: ${typography.SansSerif}
Helper Class: className="text-sans-serif"
Serif
Value: myriad-pro, sans-serif
Variable: ${typography.Serif}
Helper Class: className="text-serif"
Condensed
Value: Merriweather Sans, sans-serif
Variable: ${typography.Condensed}
Helper Class: className="text-condensed"
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et fermentum dui. Ut orci quam, ornare sed lorem sed, hendrerit auctor dolor. Nulla viverra, nibh quis ultrices malesuada, ligula ipsum vulputate diam, aliquam egestas nibh ante vel dui. Sed in tellus interdum eros vulputate placerat sed non enim. Pellentesque eget justo porttitor urna dictum fermentum sit amet sed mauris. Praesent molestie vestibulum erat ac rhoncus. Aenean nunc risus, accumsan nec.
Buttons
Standard Button
className="btn"
Button Brand 1
className="btn btn-brand1"
Button Brand 2
className="btn btn-brand2"
Button Brand 3
className="btn btn-brand3"
Button Brand 4
className="btn btn-brand4"
Button Hollow
className="btn btn-hollow"
Hollow White
className="btn btn-hollow-white"
Hollow Brand 1
className="btn btn-hollow-brand1"
Hollow Brand 2
className="btn btn-hollow-brand2"
Hollow Brand 3
className="btn btn-hollow-brand3"
Hollow Brand 4
className="btn btn-hollow-brand4"
Icon Buttons
Arrow White
className="btn btn-arrow-white"
Arrow Black
className="btn btn-hollow btn-arrow-black"
Phone White
className="btn btn-phone-white"
Phone Black
className="btn btn-hollow btn-phone-black"
Chat White
className="btn btn-chat-white"
Chat Black