Style Guide

A central guide for common components and styles used in Verywell.

Colors

Primaries and grays controlled by the Global Swatch feature.
Primary 1A
#CAF7E7
Primary 1B
#68E9BA
Primary 1C
#1F4638
Primary 2A
#E1DEFA
Primary 2B
#8879EC
Primary 2C
#3E357A
Primary 3A
#F5DEB7
Primary 3B
#D9AC5F
Primary 3C
#836839
Gray A
#F8FAF9
Gray B
#EAEEED
Gray C
#39413E
Gray D
#1C211F
White
#FFFFFF
White - Faded
rgba(255,255,255,0.1)

Typography

Headings, body and other common text elements.
Display One

Heading One

Heading Two

Heading Three

Heading Four

Heading Five
Large Text
Body Text
Small Text

Buttons

Component, text style and size variations
Default
Small

Form Inputs

General style and state variations for text inputs.
Inputs
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Labelled Input
Here is some hint text for the input.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Text Area
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Form Selectables

Styling for checkboxes, selects and radios.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.