Conversor de cores e verificador de contraste para UI de jogos (HEX, RGB, HSL, Unity, Godot)
Cole uma cor, copie no formato que a sua engine quer e confira se o texto do HUD ou do menu é legível no fundo.
- HEX
#e5530a - RGB
229, 83, 10 - HSL
20, 92%, 47% - Unity Color
new Color(0.898f, 0.325f, 0.039f) - Godot Color
Color(0.898, 0.325, 0.039)
Verificar contraste
3.34 : 1
- Texto normal (4.5): falha
- Texto grande (3): passa
- Elementos de UI (3): passa
A razão de contraste segue a fórmula do WCAG. Use para menus, legendas e texto do HUD.
Quando usar
HUD e legendas
Confira se números de vida, avisos e legendas continuam legíveis sobre céus claros e corredores escuros.
Levar cores de uma ferramenta para outra
Copie uma cor do Figma ou do Aseprite em hex e cole no Unity (0 a 1) ou no Godot sem chutar.
Menus acessíveis
Garanta que o botão selecionado se destaque dos outros, não só pela cor, mas também pelo contraste.
Vá além
EDIÇÃO GRÁTISGame Dev Guides Bundle: 6 livros em PDF para devs indie
Guia em PDF · 12 páginas
EDIÇÃO GRÁTISSmall Town Buildings: kit de cidade low poly PSX
EDIÇÃO GRÁTIS10 Game Systems para Unity: portas, inventário, save, loja e RPG
Unity 6 · URP · código C# + demo
Perguntas frequentes
O WCAG pede 4,5 para 1 em texto normal e 3 para 1 em texto grande e elementos de UI. Jogos não são obrigados, mas jogadores com baixa visão se beneficiam.
As cores do Unity usam canais de ponto flutuante de 0 a 1, então 255 vira 1,0.
Adicione contorno, sombra ou uma caixa escura semitransparente atrás. As legendas de muitos jogos usam caixa justamente por isso.
Evite diferenciar coisas só por vermelho contra verde, já que o daltonismo vermelho-verde é o tipo mais comum. Some uma forma, um ícone ou uma diferença de brilho.