The designs were created to the following widths:
- Mobile: 375px
- Desktop: 1440px
- Very dark desaturated blue (main background): hsl(222, 26%, 31%)
- Very dark desaturated blue (toggle background, keypad background): hsl(223, 31%, 20%)
- Very dark desaturated blue (screen background): hsl(224, 36%, 15%)
-
Desaturated dark blue (key background): hsl(225, 21%, 49%)
-
Desaturated dark blue (key shadow): hsl(224, 28%, 35%)
-
Red (key background, toggle): hsl(6, 63%, 50%)
-
Dark red (key shadow): hsl(6, 70%, 34%)
-
Light grayish orange (key background): hsl(30, 25%, 89%)
-
Grayish orange (key shadow): hsl(28, 16%, 65%)
- Very dark grayish blue: hsl(221, 14%, 31%)
- White: hsl(0, 0, 100%)
- Light gray (main background): hsl(0, 0%, 90%)
- Grayish red (toggle background, keypad background): hsl(0, 5%, 81%)
- Very light gray (screen background): hsl(0, 0%, 93%)
-
Dark moderate cyan (key background): hsl(185, 42%, 37%)
-
Very dark cyan (key shadow): hsl(185, 58%, 25%)
-
Orange (key background, toggle): hsl(25, 98%, 40%)
-
Dark orange (key shadow): hsl(25, 99%, 27%)
-
Light grayish yellow (key background): hsl(45, 7%, 89%)
-
Dark grayish orange (key shadow): hsl(35, 11%, 61%)
- Very dark grayish yellow: hsl(60, 10%, 19%)
- White (text): hsl(0, 0, 100%)
- Very dark violet (main background): hsl(268, 75%, 9%)
- Very dark violet (toggle background, keypad background, screen background): hsl(268, 71%, 12%)
-
Dark violet (key background): hsl(281, 89%, 26%)
-
Vivid magenta (key shadow): hsl(285, 91%, 52%)
-
Pure cyan (key background, toggle): hsl(176, 100%, 44%)
-
Soft cyan (key shadow): hsl(177, 92%, 70%)
-
Very dark violet (key background): hsl(268, 47%, 21%)
-
Dark magenta (key shadow): hsl(290, 70%, 36%)
- Light yellow: hsl(52, 100%, 62%)
- Very dark blue: hsl(198, 20%, 13%)
- White (text): hsl(0, 0, 100%)
- Font size (numbers): 32px
- Family: League Spartan
- Weights: 700