Vista previa del diseño
Detalles de los colores
01Principal
ContrasteAa 13.8Aa 1.5
02Secundario
ContrasteAa 7.4Aa 2.8
03Acento
ContrasteAa 3.5Aa 5.9
04Fondo
ContrasteAa 2.3Aa 9.0
Usa esta paleta
Variables CSS
:root {
--mocha-latte-1: #3E2723;
--mocha-latte-2: #6F4E37;
--mocha-latte-3: #A0826D;
--mocha-latte-4: #C4A484;
}Colores de Tailwind
module.exports = {
theme: {
extend: {
colors: {
'mocha-latte': {
100: '#3E2723',
200: '#6F4E37',
300: '#A0826D',
400: '#C4A484',
},
},
},
},
};Combinaciones de color accesibles
Combinaciones de texto y fondo de esta paleta que cumplen WCAG AA (4.5:1) para texto normal.
- Aa #3E2723 / #C4A484 5.9:1
- Aa #C4A484 / #3E2723 5.9:1
Colores con nombre en esta paleta
El color CSS con nombre más cercano a cada muestra.