Paleta de colores Puddle Box
Puddle Box es una paleta de 4 colores que se apoya en azules, amarillos y neutros. En OKLCH, su luminosidad va del 30% (#2B2D42, oscuro) al 97% (#FFF4E0, muy claro), y su color más saturado, #4D96FF, es vívido. 2 de sus 3 colores cromáticos están en el lado frío de la rueda cromática. 3 de sus 6 pares de colores alcanzan la relación WCAG AA de 4.5:1 para texto corrido. Está etiquetada como infantiles, intensos, azules y amarillos.
- Space Cadet #2B2D42
- Chefchaouen Blue #4D96FF
- Sunglow #FFD93D
- Cornsilk #FFF4E0
Códigos de color
| Color | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Space Cadet | #2B2D42 | rgb(43, 45, 66) | hsl(235, 21%, 21%) | oklch(30.5% 0.038 279.7) |
| Chefchaouen Blue | #4D96FF | rgb(77, 150, 255) | hsl(215, 100%, 65%) | oklch(67.7% 0.172 257.8) |
| Sunglow | #FFD93D | rgb(255, 217, 61) | hsl(48, 100%, 62%) | oklch(89.3% 0.167 94.5) |
| Cornsilk | #FFF4E0 | rgb(255, 244, 224) | hsl(39, 100%, 94%) | oklch(97% 0.029 82.6) |
Accesibilidad
Los mejores pares de texto y fondo de Puddle Box, según la relación de contraste WCAG 2, con el contraste de luminosidad APCA (Lc) del texto sobre su fondo.
| Par | WCAG 2 | Nivel | APCA Lc |
|---|---|---|---|
| #FFF4E0 sobre #2B2D42 | 12.38:1 | AAA | Lc -96.5 |
| #FFD93D sobre #2B2D42 | 9.79:1 | AAA | Lc -80.5 |
| #2B2D42 sobre #4D96FF | 4.57:1 | AA | Lc 42.3 |
Visión del color
Ningún par de colores queda a menos de ΔE 0.06 de otro bajo protanopía, deuteranopía, tritanopía o acromatopsia.
Protanopía
Deuteranopía
Tritanopía
Acromatopsia
Úsala en tu código
Instala estos colores como colores de tema de Tailwind CSS v4 con shadcn: npx shadcn@latest add https://getcolors.so/r/palette/2b2d42-4d96ff-ffd93d-fff4e0.json.
Hazla tuya
Edita los colores, crea con ellos un sistema de color completo en modo claro y oscuro, o míralos en una interfaz real.