Paleta de cores Popsicle Break
Popsicle Break é uma paleta de 4 cores baseada em azuis-esverdeados e cianos e laranjas. Em OKLCH, a luminosidade vai de 41% (#205162, escuro) a 97% (#FFF3D6, muito claro), e a cor mais saturada, #2EC4B6, é moderadamente saturada. 3 das suas 4 cores cromáticas ficam no lado frio do círculo cromático. 1 dos seus 6 pares de cores atinge a razão AA da WCAG de 4.5:1 para texto corrido. Está marcada como verão, azul-petróleo, frias e para daltonismo.
- Charcoal #205162
- Blue NCS #118AB2
- Emerald #2EC4B6
- Cornsilk #FFF3D6
Códigos de cor
| Cor | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Charcoal | #205162 | rgb(32, 81, 98) | hsl(195, 51%, 25%) | oklch(40.9% 0.059 224) |
| Blue NCS | #118AB2 | rgb(17, 138, 178) | hsl(195, 83%, 38%) | oklch(59.2% 0.112 228) |
| Emerald | #2EC4B6 | rgb(46, 196, 182) | hsl(174, 62%, 47%) | oklch(74.2% 0.121 185.4) |
| Cornsilk | #FFF3D6 | rgb(255, 243, 214) | hsl(42, 100%, 92%) | oklch(96.6% 0.04 88.2) |
Acessibilidade
Os melhores pares de texto e fundo de Popsicle Break, 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 |
|---|---|---|---|
| #FFF3D6 sobre #205162 | 7.89:1 | AAA | Lc -86.7 |
| #2EC4B6 sobre #205162 | 4.01:1 | AA texto grande | Lc -46.3 |
| #FFF3D6 sobre #118AB2 | 3.59:1 | AA texto grande | Lc -64.5 |
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/205162-118ab2-2ec4b6-fff3d6.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.