Paleta de colores Atoll Haven
Atoll Haven es una paleta de 5 colores que se apoya en verdes azulados y cianes y verdes. En OKLCH, su luminosidad va del 25% (#002828, oscuro) al 89% (#B9EBB3, claro), y su color más saturado, #6CBD8A, es moderadamente saturado. 2 de sus 5 colores cromáticos están en el lado frío de la rueda cromática. 3 de sus 10 pares de colores alcanzan la relación WCAG AA de 4.5:1 para texto corrido. Está etiquetada como océano, tranquilos, degradados, verdes y aptos para daltonismo.
- Jet #002828
- Dark Cyan #00584D
- Teal #1B8C6C
- Muted Teal #6CBD8A
- Tea Green #B9EBB3
Códigos de color
| Color | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Jet | #002828 | rgb(0, 40, 40) | hsl(180, 100%, 8%) | oklch(25.1% 0.043 194.8) |
| Dark Cyan | #00584D | rgb(0, 88, 77) | hsl(173, 100%, 17%) | oklch(41.3% 0.075 180.6) |
| Teal | #1B8C6C | rgb(27, 140, 108) | hsl(163, 68%, 33%) | oklch(57.2% 0.108 168.3) |
| Muted Teal | #6CBD8A | rgb(108, 189, 138) | hsl(142, 38%, 58%) | oklch(73.3% 0.11 155) |
| Tea Green | #B9EBB3 | rgb(185, 235, 179) | hsl(114, 58%, 81%) | oklch(89.1% 0.091 142) |
Accesibilidad
Los mejores pares de texto y fondo de Atoll Haven, 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 |
|---|---|---|---|
| #B9EBB3 sobre #002828 | 11.69:1 | AAA | Lc -83.9 |
| #002828 sobre #6CBD8A | 6.96:1 | AA | Lc 55.9 |
| #B9EBB3 sobre #00584D | 6.23:1 | AA | Lc -71.8 |
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. Está etiquetada como apta para daltonismo: todos los pares quedan al menos a ΔE 0.14.
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/002828-00584d-1b8c6c-6cbd8a-b9ebb3.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.