Цвета HTML HEX
Шестнадцатеричный цвет записывается как #RRGGBB, где RR (красный), GG (зелёный) и BB (синий) — шестнадцатеричные числа, задающие интенсивность каждого компонента цвета.
Значения цвета HEX
Цвет HEX имеет форму #rrggbb, где rr, gg и bb — шестнадцатеричные значения от 00 до ff (то же самое, что от 0 до 255 в десятичной системе).
Например, #ff0000 — красный, потому что красный на максимуме (ff), а остальные — 00. #00ff00 — зелёный по той же причине. Установите все три в 00 для чёрного и все три в ff для белого.
Пример
Шесть цветов, заданных значениями HEX.
Prompt
Страница, показывающая шесть цветных блоков, каждый с фоном, заданным HEX-значением: #ff0000, #0000ff, #3cb371, #ee82ee, #ffa500 и #6a5acd, каждый подписан своим значением.
Output: полная HTML-страница
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HEX-цвета</title>
</head>
<body>
<h1 style="background-color:#ff0000;">#ff0000</h1>
<h1 style="background-color:#0000ff;">#0000ff</h1>
<h1 style="background-color:#3cb371;">#3cb371</h1>
<h1 style="background-color:#ee82ee;">#ee82ee</h1>
<h1 style="background-color:#ffa500;">#ffa500</h1>
<h1 style="background-color:#6a5acd;">#6a5acd</h1>
</body>
</html>
Оттенки серого
Оттенки серого создаются с помощью одинакового значения для всех трёх компонентов.
Пример
Шесть оттенков серого, созданных с равными компонентами HEX.
Prompt
Страница, показывающая шесть оттенков серого в виде блоков с помощью HEX-значений с равными компонентами: #404040, #686868, #a0a0a0, #bebebe, #dcdcdc и #f8f8f8.
Output: полная HTML-страница
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Оттенки серого</title>
</head>
<body>
<h1 style="background-color:#404040;">#404040</h1>
<h1 style="background-color:#686868;">#686868</h1>
<h1 style="background-color:#a0a0a0;">#a0a0a0</h1>
<h1 style="background-color:#bebebe;">#bebebe</h1>
<h1 style="background-color:#dcdcdc;">#dcdcdc</h1>
<h1 style="background-color:#f8f8f8;">#f8f8f8</h1>
</body>
</html>