AI Code Autopilot UX Toolkit

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

Paleta składa się z kolorów Światło, Ciemny. Kolory akcentujące Autocomplete Blue #3a86ff i Linter Red #ff595e. Paleta ma temperaturę kolorów Ciepły, Neutralny, Zimny.

Według jasności paleta rozciąga się od #2D2D2D (najciemniejszy) do #F8F8F2 (najjaśniejszy). Zakres jasności jest szeroki.

Nasycenie jest mieszane — część próbek stonowana, część żywsza.

Niektóre pary barw są blisko pozycji dopełniających — można to odczytać jako kontrast dopełniający (heurystyka).

Ogólna temperatura barw przechyla się ku ciepłu.

Kody HEX (posortowane): #2D2D2D, #3A86FF, #C8E87C, #E5E5E5, #F8F8F2, #FF595E

Paleta AI Code Autopilot UX Toolkit zawiera kombinację kolorów kodów 6:

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

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

Uproszczona wersja palety kolorów

Cień Żółty zielony, Cień Czarny, Cień dodgerblue, Odcień salmon, Cień gainsboro, Odcień floralwhite

Schemat kolorów został stworzony przez colorstudio

Więcej palet z:

Kody kolorów w palecie

AI Code Autopilot UX Toolkit kody kolorów HEX, informacje RGB w tabeli

Kolor	KLĄTWA	RGB	Nazwa	alternatywne imie
#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

Kontrast palety kolorów

4 pary kolorów mają niski kontrast i wymagają poprawy, co może wpłynąć na czytelność.

Kolor tekstu	Kolor tła	Współczynnik kontrastu
#c8e87c	#e5e5e5	1.09
#c8e87c	#f8f8f2	1.28
#3a86ff	#ff595e	1.13
#e5e5e5	#f8f8f2	1.18

Paleta obrazów 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;