Style guide
Colors
Body background
Background primary
Text heading
Text body primary
Text body secondary
Text body light
Link text
Link hover
Error
Border
Accent 1
Accent 2
CTAs
Form Fields
Input
Quantity input
Accordions
Multiple opened
Single opened
Typography
H1 Boogy Brut Poster, White Desktop: 100px Mobile: 60px Tag/class name: h1, .h1
Desktop: Boogy Brut Poster
Mobile: Boogy Brut Poster
H2 Boogy Brut Poster, White Desktop: 60px Mobile: 40px Tag/class name: h2, .h2
Desktop: Boogy Brut Poster
Mobile: Boogy Brut Poster
H3 Styrene B, Regular Desktop: 32px Mobile: 26px Tag/class name: h3, .h3
Desktop: Styrene B
Mobile: Styrene B
H4 Styrene B, Light Desktop: 32px Mobile: 26px Tag/class name: h4, .h4, .h4--italic
Desktop: Styrene B
Mobile: Styrene B
Italic: Styrene B
H5 Styrene B, Light Desktop: 24px Mobile: 22px Tag/class name: h5, .h5
Desktop: Styrene B
Mobile: Styrene B
H6 Styrene B, Medium Desktop: 12px Mobile: 12px Tag/class name: h6, .h6
Desktop: Styrene B
Mobile: Styrene B
.h7 Styrene B, Regular Desktop: 42px Mobile: 34px Class name: .h7
Desktop: Styrene B
Mobile: Styrene B
Body 1 Styrene B, Regular Desktop: 18px Mobile: 16px Tag/class name: .body1
Clinically-proven skincare
Body 2 Styrene B, Regular Desktop: 16px Mobile: 16px Tag/class name: .body2
Clinically-proven skincare
Body 3 Styrene B, Regular, Medium Desktop: 14px Mobile: 14px Tag/class name: .body3, .body3--bold
Clinically-proven skincare
Clinically-proven skincare
Body 4 Styrene B, Regular Desktop: 12px Mobile: 12px Tag/class name: .body4
Clinically-proven skincare