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.
-
Red: hsl(14, 86%, 42%)
-
Green: hsl(159, 69%, 38%)
-
Rose 50: hsl(20, 50%, 98%)
-
Rose 100: hsl(13, 31%, 94%)
-
Rose 300: hsl(14, 25%, 72%)
-
Rose 400: hsl(7, 20%, 60%)
-
Rose 500: hsl(12, 20%, 44%)
-
Rose 900: hsl(14, 65%, 9%)
- Font size (product names): 16px
- Family: Red Hat Text
- Weights: 400, 600, 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. The design file for this challenge also includes a design system and tablet layout to help you build a more accurate solution faster.