Criado em 10/03/2025 22:09
Vibrant Accessibility Design System Web
- Royal Blue#3f51b5
- Sunny Day#ffca28
- Safety Orange#ff9800
- Clean Canvas White#fafafa
- High-Contrast Black#212121
- Calm Lavender#ede7f6
- Deep Moss Green#558b2f
A paleta consiste em cores Semi escuro, Luz, Escuro. Cores de destaque Royal Blue #3f51b5 e Sunny Day #ffca28. A paleta tem Legal, Esquentar, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #212121 (mais escuro) a #FAFAFA (mais claro). A faixa de luminosidade é ampla.
Saturação mista — tons suaves e acentos mais vivos.
Alguns pares de matizes estão perto de posições complementares — pode ler-se como contraste complementar (heurística).
No geral, a temperatura tende para o quente.
Códigos HEX (ordenados): #212121, #3F51B5, #558B2F, #EDE7F6, #FAFAFA, #FF9800, #FFCA28
A paleta Vibrant Accessibility Design System Web tem uma combinação de cores de códigos de 7:
HEX: #3f51b5, RGB: (63, 81, 181); HEX: #ffca28, RGB: (255, 202, 40); HEX: #ff9800, RGB: (255, 152, 0)
HEX: #fafafa, RGB: (250, 250, 250); HEX: #212121, RGB: (33, 33, 33); HEX: #ede7f6, RGB: (237, 231, 246)
HEX: #558b2f, RGB: (85, 139, 47)
Versão simplificada das cores da paleta
Matiz de slateblue, Matiz de gold, Sombra de darkorange, Sombra de whitesmoke, Sombra de Preto, Sombra de lavender, Matiz de olivedrab
O esquema de cores foi criado por colorslib
Códigos de cores na paleta
Vibrant Accessibility Design System Web códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
| #3f51b5 | #3f51b5 | RGB(63, 81, 181) | Royal Blue | — |
| #ffca28 | #ffca28 | RGB(255, 202, 40) | Sunny Day | — |
| #ff9800 | #ff9800 | RGB(255, 152, 0) | Safety Orange | — |
| #fafafa | #fafafa | RGB(250, 250, 250) | Clean Canvas White | Dr. White |
| #212121 | #212121 | RGB(33, 33, 33) | High-Contrast Black | Lead |
| #ede7f6 | #ede7f6 | RGB(237, 231, 246) | Calm Lavender | — |
| #558b2f | #558b2f | RGB(85, 139, 47) | Deep Moss Green | — |
Contraste da Paleta de Cores
7 pares de cores têm contraste baixo e precisam de melhorias, o que pode afetar a legibilidade.
| Cor do texto | Cor de fundo | Taxa de contraste |
#3f51b5 | #558b2f | 1.67 |
#ffca28 | #ff9800 | 1.4 |
#ffca28 | #fafafa | 1.46 |
#ffca28 | #ede7f6 | 1.26 |
#ff9800 | #ede7f6 | 1.78 |
#ff9800 | #558b2f | 1.9 |
Paleta de imagens Vibrant Accessibility Design System Web png
Exportar paleta
Baixe a "Vibrant Accessibility Design System Web" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: