Criado em 07/02/2025 16:51
UI Component Design Tokens
- Primary Cyan#00bcd4
- Secondary Plum#ab47bc
- Info Teal#26a69a
- Warning Amber#ffc107
- Error Crimson#d32f2f
- Neutral Grey#bdbdbd
A paleta consiste em cores Luz, Semi escuro. Cores de destaque Primary Cyan #00bcd4 e Warning Amber #ffc107. A paleta tem Legal, Esquentar, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #26A69A (mais escuro) a #BDBDBD (mais claro). A faixa de luminosidade é moderada.
A saturação global parece vívida (croma alto).
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 frio.
Códigos HEX (ordenados): #00BCD4, #26A69A, #AB47BC, #BDBDBD, #D32F2F, #FFC107
A paleta UI Component Design Tokens tem uma combinação de cores de códigos de 6:
HEX: #00bcd4, RGB: (0, 188, 212); HEX: #ab47bc, RGB: (171, 71, 188); HEX: #26a69a, RGB: (38, 166, 154)
HEX: #ffc107, RGB: (255, 193, 7); HEX: #d32f2f, RGB: (211, 47, 47); HEX: #bdbdbd, RGB: (189, 189, 189)
Versão simplificada das cores da paleta
Matiz de darkturquoise, Matiz de mediumorchid, Matiz de lightseagreen, Matiz de gold, Sombra de crimson, Matiz de Prata
O esquema de cores foi criado por colorscheme
Códigos de cores na paleta
UI Component Design Tokens códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
| #00bcd4 | #00bcd4 | RGB(0, 188, 212) | Primary Cyan | — |
| #ab47bc | #ab47bc | RGB(171, 71, 188) | Secondary Plum | — |
| #26a69a | #26a69a | RGB(38, 166, 154) | Info Teal | — |
| #ffc107 | #ffc107 | RGB(255, 193, 7) | Warning Amber | — |
| #d32f2f | #d32f2f | RGB(211, 47, 47) | Error Crimson | — |
| #bdbdbd | #bdbdbd | RGB(189, 189, 189) | Neutral Grey | Gray74 |
Contraste da Paleta de Cores
9 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 |
#00bcd4 | #26a69a | 1.3 |
#00bcd4 | #ffc107 | 1.4 |
#00bcd4 | #bdbdbd | 1.22 |
#ab47bc | #26a69a | 1.6 |
#ab47bc | #d32f2f | 1.03 |
#26a69a | #ffc107 | 1.83 |
Paleta de imagens UI Component Design Tokens png
Exportar paleta
Baixe a "UI Component Design Tokens" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: