Paleta de cores Boombox Sunset
Boombox Sunset é uma paleta de 5 cores baseada em vermelhos, rosas e neutros. Em OKLCH, a luminosidade vai de 27% (#4A0029, escuro) a 98% (#FFF5F9, muito claro), e a cor mais saturada, #D14B8F, é vívida. 4 das suas 4 cores cromáticas ficam no lado quente do círculo cromático. 3 dos seus 10 pares de cores atingem a razão AA da WCAG de 4.5:1 para texto corrido. Está marcada como retrô, neon, monocromáticas, gradiente, rosas e para daltonismo.
- Space Cadet #4A0029
- Purple #8D1B58
- Paradise Pink #D14B8F
- Cherry Blossom Pink #FF94C6
- Cultured #FFF5F9
Códigos de cor
| Cor | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Space Cadet | #4A0029 | rgb(74, 0, 41) | hsl(327, 100%, 15%) | oklch(26.7% 0.11 354.4) |
| Purple | #8D1B58 | rgb(141, 27, 88) | hsl(328, 68%, 33%) | oklch(43.6% 0.158 353.5) |
| Paradise Pink | #D14B8F | rgb(209, 75, 143) | hsl(330, 59%, 56%) | oklch(61.4% 0.181 352.4) |
| Cherry Blossom Pink | #FF94C6 | rgb(255, 148, 198) | hsl(332, 100%, 79%) | oklch(79.3% 0.14 351.3) |
| Cultured | #FFF5F9 | rgb(255, 245, 249) | hsl(336, 100%, 98%) | oklch(97.9% 0.012 351) |
Acessibilidade
Os melhores pares de texto e fundo de Boombox Sunset, pela razão de contraste WCAG 2, com o contraste de luminosidade APCA (Lc) do texto sobre o fundo.
| Par | WCAG 2 | Nível | APCA Lc |
|---|---|---|---|
| #FFF5F9 sobre #4A0029 | 14.87:1 | AAA | Lc -99.4 |
| #FFF5F9 sobre #8D1B58 | 8.10:1 | AAA | Lc -88.0 |
| #4A0029 sobre #FF94C6 | 7.79:1 | AAA | Lc 60.1 |
Visão de cores
Nenhum par de cores fica a menos de ΔE 0.06 de outro sob protanopia, deuteranopia, tritanopia ou acromatopsia. Ela está marcada como segura para daltonismo: todos os pares ficam a pelo menos ΔE 0.14.
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
Use no seu código
Instale estas cores como cores de tema do Tailwind CSS v4 com o shadcn: npx shadcn@latest add https://getcolors.so/r/palette/4a0029-8d1b58-d14b8f-ff94c6-fff5f9.json.
Faça dela a sua
Edite as cores, crie com elas um sistema de cores completo nos modos claro e escuro ou veja tudo em uma interface real.