Paleta de colores Cinnamon and Molasses
Cinnamon and Molasses es una paleta de 6 colores que se apoya en marrones, naranjas y neutros. En OKLCH, su luminosidad va del 28% (#3B2218, oscuro) al 96% (#F8F1E4, muy claro), y su color más saturado, #A0522D, es moderadamente saturado. 5 de sus 5 colores cromáticos están en el lado cálido de la rueda cromática. 6 de sus 15 pares de colores alcanzan la relación WCAG AA de 4.5:1 para texto corrido. Está etiquetada como café, cálidos, marrones, naranjas y apagados.
- Jet #3B2218
- Dim Gray #5E3B2A
- Sinopia #A0522D
- English Lavender #B88B66
- Ash Gray #D9BC98
- Seashell #F8F1E4
Códigos de color
| Color | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Jet | #3B2218 | rgb(59, 34, 24) | hsl(17, 42%, 16%) | oklch(28.2% 0.043 42.5) |
| Dim Gray | #5E3B2A | rgb(94, 59, 42) | hsl(20, 38%, 27%) | oklch(38.9% 0.057 46.5) |
| Sinopia | #A0522D | rgb(160, 82, 45) | hsl(19, 56%, 40%) | oklch(52.6% 0.115 44.6) |
| English Lavender | #B88B66 | rgb(184, 139, 102) | hsl(27, 37%, 56%) | oklch(67.1% 0.075 60.5) |
| Ash Gray | #D9BC98 | rgb(217, 188, 152) | hsl(33, 46%, 72%) | oklch(81.1% 0.059 72.9) |
| Seashell | #F8F1E4 | rgb(248, 241, 228) | hsl(39, 59%, 93%) | oklch(96% 0.019 83.1) |
Accesibilidad
Los mejores pares de texto y fondo de Cinnamon and Molasses, 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 |
|---|---|---|---|
| #F8F1E4 sobre #3B2218 | 13.09:1 | AAA | Lc -95.5 |
| #F8F1E4 sobre #5E3B2A | 8.76:1 | AAA | Lc -88.1 |
| #3B2218 sobre #D9BC98 | 8.12:1 | AAA | Lc 65.6 |
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/3b2218-5e3b2a-a0522d-b88b66-d9bc98-f8f1e4.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.