Skip to content

Latest commit

 

History

History
37 lines (23 loc) · 1.1 KB

style-guide.md

File metadata and controls

37 lines (23 loc) · 1.1 KB
Raw

Front-end Style Guide

Layout

The designs were created to the following widths:

  • Mobile: 375px
  • Desktop: 1366px

💡 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

  • Scissors Gradient: hsl(39, 89%, 49%) to hsl(40, 84%, 53%)
  • Paper Gradient: hsl(230, 89%, 62%) to hsl(230, 89%, 65%)
  • Rock Gradient: hsl(349, 71%, 52%) to hsl(349, 70%, 56%)
  • Lizard Gradient: hsl(261, 73%, 60%) to hsl(261, 72%, 63%)
  • Cyan: hsl(189, 59%, 53%) to hsl(189, 58%, 57%)

Neutral

  • Dark Text: hsl(229, 25%, 31%)
  • Score Text: hsl(229, 64%, 46%)
  • Header Outline: hsl(217, 16%, 45%)

Background

  • Radial Gradient: hsl(214, 47%, 23%) to hsl(237, 49%, 15%)

Fonts

💎 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.