Палитра «Ночной город»

Тёмный фон и бирюзовая подсветка, как неон на мокром асфальте. Подходит для IT-продуктов, игр и тёмной темы сайта.

#0B0C10rgb(11, 12, 16)

#1F2833rgb(31, 40, 51)

#45A29Ergb(69, 162, 158)

#66FCF1rgb(102, 252, 241)

#C5C6C7rgb(197, 198, 199)

Коды цветов

HEX	RGB	HSL
`#0B0C10`	`rgb(11, 12, 16)`	`hsl(228, 19%, 5%)`
`#1F2833`	`rgb(31, 40, 51)`	`hsl(213, 24%, 16%)`
`#45A29E`	`rgb(69, 162, 158)`	`hsl(177, 40%, 45%)`
`#66FCF1`	`rgb(102, 252, 241)`	`hsl(176, 96%, 69%)`
`#C5C6C7`	`rgb(197, 198, 199)`	`hsl(210, 2%, 78%)`

Так выглядит обычный текст цветом #0B0C10 на фоне #66FCF1. Контраст 15,60:1, читается хорошо.

Кнопка

Контраст каждой пары цветов по WCAG: для обычного текста нужно не меньше 4,5:1, для крупных заголовков и кнопок не меньше 3:1.

Текст	Фон	Контраст	Подходит для
Аа `#0B0C10`	`#66FCF1`	15,60:1	любой текст (AAA)
Аа `#1F2833`	`#66FCF1`	11,88:1	любой текст (AAA)
Аа `#0B0C10`	`#C5C6C7`	11,42:1	любой текст (AAA)
Аа `#1F2833`	`#C5C6C7`	8,70:1	любой текст (AAA)
Аа `#0B0C10`	`#45A29E`	6,43:1	обычный текст (AA)
Аа `#1F2833`	`#45A29E`	4,90:1	обычный текст (AA)

:root {
  --color-1: #0b0c10;
  --color-2: #1f2833;
  --color-3: #45a29e;
  --color-4: #66fcf1;
  --color-5: #c5c6c7;
}