Criado em 06/26/2025 08:26
Composable Web UX Patterns
- Atomic Tangerine#ff9e6d
- Markup Plum#9b5de5
- Grid Overlay#ced4da
- Canvas Sand#fff9ec
- Module Navy#023047
- Style Byte Blue#3a86ff
- Sticky Beige#f8e9d2
A paleta consiste em cores Luz, Escuro. Cores de destaque Canvas Sand #fff9ec e Style Byte Blue #3a86ff. A paleta tem Esquentar, Legal, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #023047 (mais escuro) a #FFF9EC (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): #023047, #3A86FF, #9B5DE5, #CED4DA, #F8E9D2, #FF9E6D, #FFF9EC
A paleta Composable Web UX Patterns tem uma combinação de cores de códigos de 7:
HEX: #ff9e6d, RGB: (255, 158, 109); HEX: #9b5de5, RGB: (155, 93, 229); HEX: #ced4da, RGB: (206, 212, 218)
HEX: #fff9ec, RGB: (255, 249, 236); HEX: #023047, RGB: (2, 48, 71); HEX: #3a86ff, RGB: (58, 134, 255)
HEX: #f8e9d2, RGB: (248, 233, 210)
Versão simplificada das cores da paleta
Matiz de lightsalmon, Matiz de mediumpurple, Matiz de lightgrey, Sombra de oldlace, Sombra de midnightblue, Sombra de dodgerblue, Matiz de antiquewhite
O esquema de cores foi criado por colorslib
Códigos de cores na paleta
Composable Web UX Patterns códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
|---|---|---|---|---|
| #ff9e6d | #ff9e6d | RGB(255, 158, 109) | Atomic Tangerine | — |
| #9b5de5 | #9b5de5 | RGB(155, 93, 229) | Markup Plum | — |
| #ced4da | #ced4da | RGB(206, 212, 218) | Grid Overlay | — |
| #fff9ec | #fff9ec | RGB(255, 249, 236) | Canvas Sand | Day Lily |
| #023047 | #023047 | RGB(2, 48, 71) | Module Navy | — |
| #3a86ff | #3a86ff | RGB(58, 134, 255) | Style Byte Blue | — |
| #f8e9d2 | #f8e9d2 | RGB(248, 233, 210) | Sticky Beige | — |
Contraste da Paleta de Cores
8 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 |
|---|---|---|
#ff9e6d | #ced4da | 1.35 |
#ff9e6d | #fff9ec | 1.93 |
#ff9e6d | #3a86ff | 1.71 |
#ff9e6d | #f8e9d2 | 1.69 |
#9b5de5 | #3a86ff | 1.18 |
#ced4da | #fff9ec | 1.42 |
Paleta de imagens Composable Web UX Patterns png
Exportar paleta
Baixe a "Composable Web UX Patterns" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: