Hatco Style Guide

Brand Color Palettes

#EF4135
.brand
#FF6055
.brand-light
#AB1F22
.brand-dark
#631416
.brand-darker
#2B090A
.brand-darkest

Neutral Color Palettes

#FAFAFA
.gray-lightest
#F3F4F4
.gray-lighter
#D6D6D6
.gray-light
#A3A5A8
.gray
#363636
.gray-dark
#191616
.gray-darker
#000000
.black

Gradients

Gradient GrayBlue
.gradient-x.gradient-x-hover.gradient-x-grayblue
Gradient Primary
.gradient-x.gradient-x-hover.gradient-x-primary
Gradient Purple
.gradient-x.gradient-x-hover.gradient-x-purple
Gradient Green
.gradient-x.gradient-x-hover.gradient-x-green
Gradient Blue
.gradient-x.gradient-x-hover.gradient-x-blue
Gradient LightBlue
.gradient-x.gradient-x-hover.gradient-x-lightblue
Gradient Orange
.gradient-x.gradient-x-hover.gradient-x-orange

Heading Utility Classes

Display
.heading-display.--as-title
Heading 1
.heading-display.--as-h1
Heading 2
.heading-display.--as-h2
Heading 3
.heading-display.--as-h3
Heading 4
.heading-display.--as-h4
Heading 5
.heading-display.--as-h5
Heading 6
.heading-display.--as-h6
Font Scale
.text-9xl
.text-8xl
.text-7xl
.text-6xl
.text-5xl
.text-4xl
.text-3xl
.text-2xl
.text-xl
.text-lg
.text-base
.text-sm
.text-xs
.text-xxs

Swiper (off-canvas)

Buffet Warmers
Built-Ins
Carving Stations
Drawer Warmers
Fry Stations
Holding Cabinets
Induction Warmers
Lamps
Light Cooking
Merchandisers
Strip Heaters
Toasters
Warming Drawers
Water Heating
Wells
Category Icons (SVG)
Buffet Warmers
Built-Ins
Carving Stations
Drawer Warmers
Fry Stations
Holding Cabinets
Induction Warmers
Lamps
Light Cooking
Merchandisers
Strip Heaters
Toasters
Warming Drawers
Water Heating
Wells