Brand Guide Template
Brand Colors: Start 4 and add as needed (also can rename in the Global Font settings)
Primary
#507089
Secondary
#F7F7F8
Text
#192934
Accent
#F9C051
Brand Font Styles: Based on the Perfect Fourth scale using Poppins Font
Extra Large Title
Large Title
Medium Title
Small Title
Large Body Text
Body Text
Buttons and Menus
Small Body
Subheaders
Design System Guide: Use this as a starter
Border Radius - 12px
Box Shadow - 0px, 10px, 40px, -4px - .1 opacity
Guide for card spacing
Card Spacing (gutters/gaps) 20px desktop/horizontal 40px mobile/vertical Card Inner spacing: 60px top and bottoms
Card Global Style
Card Spacing (gutters) 20px desktop/horizontal - Gutters 40px mobile/vertical - Gutters Card Inner spacing: 60px top and bottom 20px on the sides
Card Global Style
Card Spacing (gutters) 20px desktop/horizontal - Gutters 40px mobile/vertical - Gutters Card Inner spacing: 60px top and bottom 20px on the sides
Card Global Style
Card Spacing (gutters) 20px desktop/horizontal - Gutters 40px mobile/vertical - Gutters Card Inner spacing: 60px top and bottom 20px on the sides
Large Container Guide
Large Space: 100px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section
Medium Container Guide
Large Space: 80px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section
Small Container Guide
Large Space: 60px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section
Large Narrow Container Guide
Large Space: 100px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section
Medium Narrow Container Guide
Large Space: 80px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section
Small Narrow Container Guide
Large Space: 60px top and bottom; 20px on the sides
Container Width: 1280px for full sections 846 px for the narrow section