Criado em 08/11/2025 08:54
Web Component Adaptive Layout
- Responsive Blue#3b9ae1
- Flex Mint#9ae1d4
- Grid Amber#ffc857
- Breakpoint Gray#8d99ae
- Overflow Orange#ff9f1c
- Container White#fafafa
- Nav Black#2b2b2b
A paleta consiste em cores Luz, Escuro. Cores de destaque Responsive Blue #3b9ae1 e Grid Amber #ffc857. A paleta tem Legal, Esquentar, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #2B2B2B (mais escuro) a #FAFAFA (mais claro). A faixa de luminosidade é ampla.
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): #2B2B2B, #3B9AE1, #8D99AE, #9AE1D4, #FAFAFA, #FF9F1C, #FFC857
A paleta Web Component Adaptive Layout tem uma combinação de cores de códigos de 7:
HEX: #3b9ae1, RGB: (59, 154, 225); HEX: #9ae1d4, RGB: (154, 225, 212); HEX: #ffc857, RGB: (255, 200, 87)
HEX: #8d99ae, RGB: (141, 153, 174); HEX: #ff9f1c, RGB: (255, 159, 28); HEX: #fafafa, RGB: (250, 250, 250)
HEX: #2b2b2b, RGB: (43, 43, 43)
Versão simplificada das cores da paleta
Sombra de dodgerblue, Matiz de paleturquoise, Sombra de gold, Sombra de lightslategrey, Matiz de Laranja, Sombra de whitesmoke, Sombra de Preto
O esquema de cores foi criado por palettespicker
Códigos de cores na paleta
Web Component Adaptive Layout códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
| #3b9ae1 | #3b9ae1 | RGB(59, 154, 225) | Responsive Blue | — |
| #9ae1d4 | #9ae1d4 | RGB(154, 225, 212) | Flex Mint | — |
| #ffc857 | #ffc857 | RGB(255, 200, 87) | Grid Amber | — |
| #8d99ae | #8d99ae | RGB(141, 153, 174) | Breakpoint Gray | — |
| #ff9f1c | #ff9f1c | RGB(255, 159, 28) | Overflow Orange | — |
| #fafafa | #fafafa | RGB(250, 250, 250) | Container White | Dr. White |
| #2b2b2b | #2b2b2b | RGB(43, 43, 43) | Nav Black | Shoe Wax |
Contraste da Paleta de Cores
12 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 |
#3b9ae1 | #ffc857 | 1.97 |
#3b9ae1 | #8d99ae | 1.05 |
#3b9ae1 | #ff9f1c | 1.48 |
#9ae1d4 | #ffc857 | 1.03 |
#9ae1d4 | #8d99ae | 1.93 |
#9ae1d4 | #ff9f1c | 1.37 |
Paleta de imagens Web Component Adaptive Layout png
Exportar paleta
Baixe a "Web Component Adaptive Layout" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: