React Native Mobile Canvas
- Touch Indigo#5c6bc0
- Scroll White#ffffff
- Gesture Lime#dce775
- Avatar Coral#ff8a65
- Modal Overlay#212121
- Input Sky#81d4fa
- Shadow Grey#bdbdbd
Criado em 07/04/2025 09:40
A paleta consiste em cores Semi escuro, Claro, Escuro. Cores de destaque Avatar Coral #ff8a65 e Input Sky #81d4fa. A paleta tem Frio, Neutro, Quente temperatura de cores.
Em luminosidade, a paleta vai de #212121 (mais escuro) a #FFFFFF (mais claro). A faixa de luminosidade é ampla.
Saturação mista — 3 suaves e 3 vívidas em 7 cores.
Algumas cores ficam quase opostas no círculo cromático, dando à paleta um contraste complementar.
Notas quentes e frias estão bastante equilibradas (2 quentes, 2 frias).
Códigos HEX (ordenados): #212121, #5C6BC0, #81D4FA, #BDBDBD, #DCE775, #FF8A65, #FFFFFF
A paleta React Native Mobile Canvas combina 7 códigos de cor:
HEX: #5c6bc0, RGB: (92, 107, 192); HEX: #ffffff, RGB: (255, 255, 255); HEX: #dce775, RGB: (220, 231, 117)
HEX: #ff8a65, RGB: (255, 138, 101); HEX: #212121, RGB: (33, 33, 33); HEX: #81d4fa, RGB: (129, 212, 250)
HEX: #bdbdbd, RGB: (189, 189, 189)
Versão simplificada das cores da paleta
Tom claro de Azul-royal, Branco, Tom escuro de Cáqui, Tom claro de Coral, Tom claro de Preto, Tom claro de Azul-céu, Tom escuro de Prata
O esquema de cores foi criado por hex
Códigos de cores na paleta
React Native Mobile Canvas códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
|---|---|---|---|---|
| #5c6bc0 | #5c6bc0 | RGB(92, 107, 192) | Touch Indigo | — |
| #ffffff | #ffffff | RGB(255, 255, 255) | Scroll White | White |
| #dce775 | #dce775 | RGB(220, 231, 117) | Gesture Lime | — |
| #ff8a65 | #ff8a65 | RGB(255, 138, 101) | Avatar Coral | — |
| #212121 | #212121 | RGB(33, 33, 33) | Modal Overlay | Lead |
| #81d4fa | #81d4fa | RGB(129, 212, 250) | Input Sky | — |
| #bdbdbd | #bdbdbd | RGB(189, 189, 189) | Shadow 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 | Razão de contraste |
|---|---|---|
#ffffff | #dce775 | 1.33 |
#ffffff | #81d4fa | 1.64 |
#ffffff | #bdbdbd | 1.87 |
#dce775 | #ff8a65 | 1.73 |
#dce775 | #81d4fa | 1.23 |
#dce775 | #bdbdbd | 1.4 |
Paleta de imagens React Native Mobile Canvas png
Exportar paleta
Baixe a "React Native Mobile Canvas" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: