Colors
brand 1#131927 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand1} ${colors.brand1Dark} ${colors.brand1Darker} ${colors.brand1Darkest} ${colors.brand1Light} ${colors.brand1Lighter} ${colors.brand1Lightest}
brand 2#44AFB7 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand2} ${colors.brand2Dark} ${colors.brand2Darker} ${colors.brand2Darkest} ${colors.brand2Light} ${colors.brand2Lighter} ${colors.brand2Lightest}
brand 3#D5AA49 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand3} ${colors.brand3Dark} ${colors.brand3Darker} ${colors.brand3Darkest} ${colors.brand3Light} ${colors.brand3Lighter} ${colors.brand3Lightest}
brand 4#9DCEA2 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand4} ${colors.brand4Dark} ${colors.brand4Darker} ${colors.brand4Darkest} ${colors.brand4Light} ${colors.brand4Lighter} ${colors.brand4Lightest}
brand 5#41878C SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.brand5} ${colors.brand5Dark} ${colors.brand5Darker} ${colors.brand5Darkest} ${colors.brand5Light} ${colors.brand5Lighter} ${colors.brand5Lightest}
brand 6#2D2D2D 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#F6F6F6 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#333741 SL
SL
SL
SL
SL
SL
SL
Variables: ${colors.body} ${colors.bodyDark} ${colors.bodyDarker} ${colors.bodyDarkest} ${colors.bodyLight} ${colors.bodyLighter} ${colors.bodyLightest}
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: semplicitapro, sans-serif
Variable: ${typography.SansSerif}
Helper Class: className="text-sans-serif"
Serif
Value: playfair-display, serif
Variable: ${typography.Serif}
Helper Class: className="text-serif"
Condensed
Value: roboto-condensed, sans-serif
Variable: ${typography.Condensed}
Helper Class: className="text-condensed"
Display
Value: playfair-display, serif
Variable: ${typography.Display}
Helper Class: className="text-display"
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