AI Code Autopilot UX Toolkit

Refactor Lime
#c8e87c
IDE Background
#2d2d2d
Autocomplete Blue
#3a86ff
Linter Red
#ff595e
Smart Suggest Grey
#e5e5e5
Syntax Light
#f8f8f2

A paleta consiste em cores Luz, Escuro. Cores de destaque Autocomplete Blue #3a86ff e Linter Red #ff595e. A paleta tem Esquentar, Neutro, Legal temperatura de cores.

Em luminosidade, a paleta vai de #2D2D2D (mais escuro) a #F8F8F2 (mais claro). A faixa de luminosidade é ampla.

Saturação mista — tons suaves e acentos mais vivos.

Alguns pares de matizes estão perto de posições complementares — pode ler-se como contraste complementar (heurística).

No geral, a temperatura tende para o quente.

Códigos HEX (ordenados): #2D2D2D, #3A86FF, #C8E87C, #E5E5E5, #F8F8F2, #FF595E

A paleta AI Code Autopilot UX Toolkit tem uma combinação de cores de códigos de 6:

HEX: #c8e87c, RGB: (200, 232, 124); HEX: #2d2d2d, RGB: (45, 45, 45); HEX: #3a86ff, RGB: (58, 134, 255)

HEX: #ff595e, RGB: (255, 89, 94); HEX: #e5e5e5, RGB: (229, 229, 229); HEX: #f8f8f2, RGB: (248, 248, 242)

Versão simplificada das cores da paleta

Sombra de Amarelo verde, Sombra de Preto, Sombra de dodgerblue, Matiz de salmon, Sombra de gainsboro, Matiz de floralwhite

O esquema de cores foi criado por colorstudio

Mais paletas com:

Códigos de cores na paleta

AI Code Autopilot UX Toolkit códigos de cores HEX, informações RGB na tabela

Cor	HEX	RGB	Nome	nome alternativo
#c8e87c	#c8e87c	RGB(200, 232, 124)	Refactor Lime	—
#2d2d2d	#2d2d2d	RGB(45, 45, 45)	IDE Background	—
#3a86ff	#3a86ff	RGB(58, 134, 255)	Autocomplete Blue	—
#ff595e	#ff595e	RGB(255, 89, 94)	Linter Red	—
#e5e5e5	#e5e5e5	RGB(229, 229, 229)	Smart Suggest Grey	Gray90
#f8f8f2	#f8f8f2	RGB(248, 248, 242)	Syntax Light	Pure White

Contraste da Paleta de Cores

4 pares de cores têm contraste baixo e precisam de melhorias, o que pode afetar a legibilidade.

Cor do texto	Cor de fundo	Taxa de contraste
#c8e87c	#e5e5e5	1.09
#c8e87c	#f8f8f2	1.28
#3a86ff	#ff595e	1.13
#e5e5e5	#f8f8f2	1.18

Paleta de imagens AI Code Autopilot UX Toolkit png

--color-refactor-lime:	#c8e87c;
--color-ide-background:	#2d2d2d;
--color-autocomplete-blue:	#3a86ff;
--color-linter-red:	#ff595e;
--color-smart-suggest-grey:	#e5e5e5;
--color-syntax-light:	#f8f8f2;

$color-refactor-lime:	#c8e87c;
$color-ide-background:	#2d2d2d;
$color-autocomplete-blue:	#3a86ff;
$color-linter-red:	#ff595e;
$color-smart-suggest-grey:	#e5e5e5;
$color-syntax-light:	#f8f8f2;

@color-refactor-lime:	#c8e87c;
@color-ide-background:	#2d2d2d;
@color-autocomplete-blue:	#3a86ff;
@color-linter-red:	#ff595e;
@color-smart-suggest-grey:	#e5e5e5;
@color-syntax-light:	#f8f8f2;