Layout
Gutters will be 24px on each side of the page and 24px between Columns, expanding to 64px and 32px on Desktop. When using the default layout settings, blocks will be (up to) 784px wide, unless they are set to wide mode in which case they’ll extend to 1192px. (these widths can also be manually set on a case-by-case basis as needed, these are just the defaults)
Spacing
Margin/Padding sizes come in a range from “Small” (8px) to “XXX Large” (256px). On smaller viewports, these values will all scale down to their next smallest neighbor. For example “X-Large” on mobile is 32px instead of 48. Small remains at 16px no matter what.
Small (16px)
Medium (24px)
Large (32px)
X-Large (48px)
XX-Large (80px)
XXX-Large (120px)
Color Palette
Black
#000000
Emerald
#00605b
Emerald Shade
#004f4a
Emerald 10% Tint
#e6efef
Orange
#f5521a
Gold
#cc8500
Navy
#1f4761
Dark Gray
#454547
Medium Gray
#7d7d80
Light Gray
#e8e5e8
Light Gray 25% Tint
#f9f8f9
White
#ffffff
Action Blue
#3368fa
Action Blue 10% Tint
#ebf0ff
Action Blue Shade
#123593