Variáveis CSS
:root {
--c-vibrant-1: #E4FFFF;
--c-vibrant-2: #E63410;
--c-vibrant-3: #A23737;
--c-vibrant-4: #FFEC40;
--c-vibrant-5: #81913B;
--c-vibrant-6: #26F675;
--c-vibrant-7: #4C714E;
--c-vibrant-8: #40EBDA;
--c-vibrant-9: #394E4E;
--c-vibrant-10: #0A0A0A;
}
Sobre esta paleta
Esta paleta vibrante de 10 cores vai de Bubbles (#E4FFFF), o tom mais claro, até Existential Angst (#0A0A0A), o mais escuro. Ela reúne Bubbles, Vulcan Fire, Hibiscus Red, Hollandaise, Wasabi Nuts, Synthetic Spearmint, Fairway, Fresh Turquoise, Night Watch e Existential Angst em um único conjunto que você pode levar direto para uma interface. Dos seus 45 pares de cores, 16 atingem o limiar de contraste WCAG AA (4,5:1) para texto corrido — o mais forte é #E4FFFF sobre #0A0A0A, com 18,9:1.
Uma paleta versátil para páginas de marketing, blocos hero de produtos, ilustrações e estados de destaque na interface.
Análise das cores
Contraste e acessibilidade
16 de 45 pares de cores atingem o limiar de contraste WCAG AA (4,5:1) para texto corrido.