Hoverstate Design Framework
- Action Orange#ffa069
- Select Mint#b9ffe0
- Modal Ink#0e0e0e
- Canvas White#ffffff
- Sidebar Violet#cabeff
- Hint Gray#dddddd
- Pulse Rose#ffacc7
Criado em 06/05/2025 20:29
A paleta consiste em cores Claro, Escuro. Cores de destaque Select Mint #b9ffe0 e Pulse Rose #ffacc7. A paleta tem Quente, Frio, Neutro temperatura de cores.
Em luminosidade, a paleta vai de #0E0E0E (mais escuro) a #FFFFFF (mais claro). A faixa de luminosidade é ampla.
A saturação global parece vívida (croma alto) — 57% das cores são vívidas.
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): #0E0E0E, #B9FFE0, #CABEFF, #DDDDDD, #FFA069, #FFACC7, #FFFFFF
A paleta Hoverstate Design Framework combina 7 códigos de cor:
HEX: #ffa069, RGB: (255, 160, 105); HEX: #b9ffe0, RGB: (185, 255, 224); HEX: #0e0e0e, RGB: (14, 14, 14)
HEX: #ffffff, RGB: (255, 255, 255); HEX: #cabeff, RGB: (202, 190, 255); HEX: #dddddd, RGB: (221, 221, 221)
HEX: #ffacc7, RGB: (255, 172, 199)
Versão simplificada das cores da paleta
Tom escuro de Salmão-claro, Tom claro de Água-marinha, Tom claro de Preto, Branco, Tom claro de Azul-aço-claro, Tom claro de Gainsboro, Tom escuro de Rosa-claro
O esquema de cores foi criado por colorhunt
Códigos de cores na paleta
Hoverstate Design Framework códigos de cores HEX, informações RGB na tabela
| Cor | HEX | RGB | Nome | nome alternativo |
|---|---|---|---|---|
| #ffa069 | #ffa069 | RGB(255, 160, 105) | Action Orange | — |
| #b9ffe0 | #b9ffe0 | RGB(185, 255, 224) | Select Mint | — |
| #0e0e0e | #0e0e0e | RGB(14, 14, 14) | Modal Ink | — |
| #ffffff | #ffffff | RGB(255, 255, 255) | Canvas White | White |
| #cabeff | #cabeff | RGB(202, 190, 255) | Sidebar Violet | — |
| #dddddd | #dddddd | RGB(221, 221, 221) | Hint Gray | Steam |
| #ffacc7 | #ffacc7 | RGB(255, 172, 199) | Pulse Rose | — |
Contraste da paleta de cores
14 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 |
|---|---|---|
#ffa069 | #b9ffe0 | 1.75 |
#ffa069 | #cabeff | 1.17 |
#ffa069 | #dddddd | 1.47 |
#ffa069 | #ffacc7 | 1.14 |
#b9ffe0 | #ffffff | 1.13 |
#b9ffe0 | #cabeff | 1.49 |
Paleta de imagens Hoverstate Design Framework png
Exportar paleta
Baixe a "Hoverstate Design Framework" em vários formatos para integração perfeita em seus projetos de design.
Formatos disponíveis: