style-guide.md

Front-end Style Guide

Layout

The designs were created to the following widths:

• Mobile: 375px
• Desktop: 1440px

💡 These are just the design sizes. Ensure content is responsive and meets WCAG requirements by testing the full range of screen sizes from 320px to large screens.

Colors

Primary

• Desaturated Dark Cyan: hsl(180, 29%, 50%)

Neutral

• Light Grayish Cyan (Background): hsl(180, 52%, 96%)
• Light Grayish Cyan (Filter Tablets): hsl(180, 31%, 95%)
• Dark Grayish Cyan: hsl(180, 8%, 52%)
• Very Dark Grayish Cyan: hsl(180, 14%, 20%)

Typography

Body Copy

• Font size: 15px

Headings

• Family: League Spartan
• Weights: 500, 700

💎 Upgrade to Pro for design file access to see all design details and get hands-on experience using a professional workflow with tools like Figma.