Conversión de cores
#ca4e4e
≈ Chestnut Rose
Variacións
O propósito desta sección é producir con precisión matices (branco puro engadido) e sombras (negro puro engadido) da cor seleccionada en incrementos do 10 %.
Consello profesional: Usa sombras para os estados de paso do cursor e as sombras, e matices para as luces e os fondos.
Sombras
Variacións máis escuras creadas engadindo negro á cor base.
Tintes
Variacións máis claras creadas engadindo branco á cor base.
Casos de uso comúns
- • Estados dos compoñentes da IU (pausando o cursor, activo, desactivado)
- • Crear profundidade con sombras e luces
- • Construción de sistemas de cores consistentes
Consello do sistema de deseño
Estas variacións constitúen a base dunha paleta de cores cohesiva. Expórtaas para manter a coherencia en todo o proxecto.
combinacións de cores
Cada harmonía ten o seu propio ambiente. Usa harmonías para facer unha chuvia de ideas sobre combinacións de cores que funcionen ben xuntas.
Como usar
Fai clic en calquera cor para copiar o seu valor hexadecimal. Está matematicamente probado que estas combinacións crean harmonía visual.
Por que importa
As harmonías de cores crean equilibrio e evocan emocións específicas nos teus deseños.
Complemento
Unha cor e o seu oposto no círculo cromático, +180 graos de matiz. Alto contraste.
Complementario dividido
Unha cor e dúas adxacentes ao seu complementario, a +/-30 graos de matiz desde o valor oposto á cor principal. Atrevida coma un complementario directo, pero máis versátil.
Triádico
Tres cores espazadas uniformemente ao longo do círculo cromático, cada unha separada por 120 graos de tonalidade. É mellor deixar que unha cor domine e usar as outras como acentos.
Análogo
Tres cores coa mesma luminancia e saturación con tons adxacentes no círculo cromático, separados por 30 graos. Transicións suaves.
monocromático
Tres cores da mesma tonalidade con valores de luminancia de +/-50 %. Sutil e refinada.
Tetrádico
Dous conxuntos de cores complementarias, separadas por 60 graos de tonalidade.
Principios da teoría da cor
Equilibrio
Usa unha cor dominante, apóiaa con secundarias e acentúa con moderación.
Contraste
Asegúrate de ter un contraste suficiente para a lexibilidade e a accesibilidade.
Harmonía
As cores deben funcionar conxuntamente para crear unha experiencia visual unificada.
Comprobador de contraste de cor
Proba as combinacións de cores para garantir que cumpren cos estándares de accesibilidade WCAG para a lexibilidade do texto.
Cor do texto
Cor de fondo
Contraste
Estándares WCAG
Todo o mundo é un xenio. Pero se xulgas un peixe pola súa capacidade para subir a unha árbore, vivirá toda a súa vida crendo que é estúpido.