Gerar paleta
  1. Paletas de cores
  2. Accessible Contrast Design Tokens

Accessible Contrast Design Tokens

  • Readable Blue
    #1e88e5
  • Overlay White
    #ffffff
  • Focus Black
    #0c0c0c
  • Highlight Yellow
    #fff176
  • Toggle Red
    #ff5252
  1
Criado em 07/05/2025 13:18
porhex
A paleta consiste em cores Claro, Escuro. Cores de destaque Readable Blue #1e88e5 e Highlight Yellow #fff176. A paleta tem Frio, Neutro, Quente temperatura de cores.

Em luminosidade, a paleta vai de #0C0C0C (mais escuro) a #FFFFFF (mais claro). A faixa de luminosidade é ampla.

A saturação global parece vívida (croma alto) — 60% das cores são vívidas.

Algumas cores ficam quase opostas no círculo cromático, dando à paleta um contraste complementar.

No geral, a temperatura tende para o quente (2 de 5).

Códigos HEX (ordenados): #0C0C0C, #1E88E5, #FF5252, #FFF176, #FFFFFF

A paleta Accessible Contrast Design Tokens combina 5 códigos de cor:
HEX: #1e88e5, RGB: (30, 136, 229); HEX: #ffffff, RGB: (255, 255, 255); HEX: #0c0c0c, RGB: (12, 12, 12)
HEX: #fff176, RGB: (255, 241, 118); HEX: #ff5252, RGB: (255, 82, 82)
Versão simplificada das cores da paleta
Tom escuro de Azul-dodger, Branco, Tom claro de Preto, Tom claro de Cáqui, Tom escuro de Tomate
O esquema de cores foi criado por hex

Códigos de cores na paleta

Accessible Contrast Design Tokens códigos de cores HEX, informações RGB na tabela

Cor HEX RGB Nome nome alternativo
#1e88e5 #1e88e5 RGB(30, 136, 229)Readable Blue—
#ffffff #ffffff RGB(255, 255, 255)Overlay WhiteWhite
#0c0c0c #0c0c0c RGB(12, 12, 12)Focus BlackBlack Wash
#fff176 #fff176 RGB(255, 241, 118)Highlight Yellow—
#ff5252 #ff5252 RGB(255, 82, 82)Toggle Red—

Contraste da paleta de cores

2 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
#1e88e5
#ff5252
1.15
#ffffff
#fff176
1.16

Paleta de imagens Accessible Contrast Design Tokens png

Accessible Contrast Design Tokens - #553801
 Baixar imagem