Basalt and Summit color palette
Basalt and Summit is a 5-color palette drawing on teals and cyans, blues, purples and neutrals. In OKLCH its lightness runs from 33% (#153B3D, dark) to 96% (#DFF6FF, very light), and its most saturated color, #585D84, is muted. 3 of its 4 chromatic colors sit on the cool side of the hue wheel. 3 of its 10 color pairs reach the WCAG AA ratio of 4.5:1 for body text. It is tagged nature, cold, purple, muted, calm and colorblind-friendly.
- Midnight Green #153B3D
- Dusty Grape #585D84
- Cool Gray #9689A8
- Light Cornflower Blue #A9C3DF
- Light Cyan #DFF6FF
Color codes
| Color | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Midnight Green | #153B3D | rgb(21, 59, 61) | hsl(183, 49%, 16%) | oklch(32.6% 0.043 200) |
| Dusty Grape | #585D84 | rgb(88, 93, 132) | hsl(233, 20%, 43%) | oklch(49% 0.063 278.2) |
| Cool Gray | #9689A8 | rgb(150, 137, 168) | hsl(265, 15%, 60%) | oklch(65.2% 0.048 304.2) |
| Light Cornflower Blue | #A9C3DF | rgb(169, 195, 223) | hsl(211, 46%, 77%) | oklch(80.7% 0.049 250.4) |
| Light Cyan | #DFF6FF | rgb(223, 246, 255) | hsl(197, 100%, 94%) | oklch(95.9% 0.027 223.2) |
Accessibility
The best text and background pairs in Basalt and Summit, by WCAG 2 contrast ratio, with the APCA lightness contrast (Lc) of the text on its background.
| Pair | WCAG 2 | Level | APCA Lc |
|---|---|---|---|
| #DFF6FF on #153B3D | 10.88:1 | AAA | Lc -92.6 |
| #A9C3DF on #153B3D | 6.70:1 | AA | Lc -62.0 |
| #DFF6FF on #585D84 | 5.66:1 | AA | Lc -78.1 |
Color vision
No pair of colors comes within ΔE 0.06 of another under protanopia, deuteranopia, tritanopia or achromatopsia. It is tagged colorblind-friendly: every pair stays at least ΔE 0.14 apart.
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
Use it in code
Install these colors as Tailwind CSS v4 theme colors with shadcn: npx shadcn@latest add https://getcolors.so/r/palette/153b3d-585d84-9689a8-a9c3df-dff6ff.json.
Make it your own
Edit the colors, build a full light and dark color system from them, or see them on real UI.