Vista previa del diseño
Detalles de los colores
01Principal
ContrasteAa 8.5Aa 2.5
02Secundario
ContrasteAa 6.6Aa 3.2
03Acento
ContrasteAa 6.0Aa 3.5
04Fondo
ContrasteAa 3.8Aa 5.6
Usa esta paleta
Variables CSS
:root {
--berry-blend-1: #8B008B;
--berry-blend-2: #9400D3;
--berry-blend-3: #8A2BE2;
--berry-blend-4: #9370DB;
}Colores de Tailwind
module.exports = {
theme: {
extend: {
colors: {
'berry-blend': {
100: '#8B008B',
200: '#9400D3',
300: '#8A2BE2',
400: '#9370DB',
},
},
},
},
};Combinaciones de color accesibles
Combinaciones de texto y fondo de esta paleta que cumplen WCAG AA (4.5:1) para texto normal.
Ninguna combinación de esta paleta alcanza 4.5:1. Usa texto negro o blanco para el texto principal.
Colores con nombre en esta paleta
El color CSS con nombre más cercano a cada muestra.