Responsive Motion Design Kit
- Ease Blue#1976d2
- Transition Coral#ff6f61
- Bounce Mint#81c784
- Delay Yellow#fbc02d
- Frame Gray#9e9e9e
- Stage Black#1a1a1a
Criado em 08/11/2025 14:40
A paleta consiste em cores Semi escuro, Claro, Escuro. Cores de destaque Ease Blue #1976d2 e Transition Coral #ff6f61. A paleta tem Frio, Quente, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #1A1A1A (mais escuro) a #FBC02D (mais claro). A faixa de luminosidade é ampla.
Saturação mista — 2 suaves e 3 vívidas em 6 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): #1976D2, #1A1A1A, #81C784, #9E9E9E, #FBC02D, #FF6F61
A paleta Responsive Motion Design Kit combina 6 códigos de cor:
HEX: #1976d2, RGB: (25, 118, 210); HEX: #ff6f61, RGB: (255, 111, 97); HEX: #81c784, RGB: (129, 199, 132)
HEX: #fbc02d, RGB: (251, 192, 45); HEX: #9e9e9e, RGB: (158, 158, 158); HEX: #1a1a1a, RGB: (26, 26, 26)
Versão simplificada das cores da paleta
Tom escuro de Azul-aço, Tom escuro de Salmão, Tom claro de Verde-mar-escuro, Tom claro de Vara-dourada, Tom escuro de Cinza-escuro, Tom claro de Preto
O esquema de cores foi criado por colorscheme
Códigos de cores na paleta
Responsive Motion Design Kit códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
|---|---|---|---|---|
| #1976d2 | #1976d2 | RGB(25, 118, 210) | Ease Blue | — |
| #ff6f61 | #ff6f61 | RGB(255, 111, 97) | Transition Coral | Living Coral |
| #81c784 | #81c784 | RGB(129, 199, 132) | Bounce Mint | — |
| #fbc02d | #fbc02d | RGB(251, 192, 45) | Delay Yellow | — |
| #9e9e9e | #9e9e9e | RGB(158, 158, 158) | Frame Gray | Gray62 |
| #1a1a1a | #1a1a1a | RGB(26, 26, 26) | Stage Black | Gray10 |
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 | Razão de contraste |
|---|---|---|
#1976d2 | #ff6f61 | 1.68 |
#1976d2 | #9e9e9e | 1.71 |
#ff6f61 | #81c784 | 1.35 |
#ff6f61 | #fbc02d | 1.64 |
#ff6f61 | #9e9e9e | 1.01 |
#81c784 | #fbc02d | 1.21 |
Paleta de imagens Responsive Motion Design Kit png
Exportar paleta
Baixe a "Responsive Motion Design Kit" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: