Цвета CSS

Ниже представлен преобразователь синтаксиса цвета, отображающий значения выбранного цвета в системе RGB (RGB), шестнадцатеричной (HEX), цветовом формате HSL (HSL) и цветовом формате HWB (HWB). Все значения цветов RGB, HEX, HSL и HWB здесь, хотя они записаны по-разному, представляют одно и то же значение цвета.

Выбор цвета с помощью выборщика цвета и непрозрачности с помощью ползунка обновляет значения RGB, HEX, HSL и HWB. При выборе нового значения цвета или непрозрачности цвет фона и ползунок обновляются с помощью свойств CSS background-color и accent-color соответственно.

Чтобы увидеть код этого преобразователя синтаксиса цвета, посмотрите исходный код на GitHub.

• color
• opacity

• @color-profile
  • components описатель
  • rendering-intent описатель
  • src описатель

• Функции цвета:
  • rgb()
  • hsl()
  • hwb()
  • lab()
  • lch()
  • oklab()
  • oklch()
  • color()
• color-contrast() Экспериментально
• color-mix()
• device-cmyk()
• light-dark()

• <color>
• <color-function>
• <hex-color>
• <named-color>
• <alpha-value>
• <hue>
• <system-color>
• <colorspace-params>

• цветовое пространство
• currentcolor
• интерполяция
• RGB
• transparent

• CSSColorProfileRule

Применение цвета к элементам HTML с помощью CSS

Руководство по использованию CSS для применения цвета к различным типам содержимого, включая все свойства CSS, которые принимают <color> в качестве значения.

Значения цветов CSS

Обзор цветовых пространств и различных <color> функциональных обозначений, доступных в CSS.

Рациональное использование цвета

Теория цвета и ресурсы, включая подбор подходящих цветов для создания доступной цветовой палитры, контрастности и цветной печати.

Использование относительных цветов

Эта статья объясняет относительный синтаксис цветов CSS, показывает различные варианты и рассматривает несколько наглядных примеров.

Понимание цвета и яркости

Восприятие цвета и использование цветов с учетом пользователей, не воспринимающих цвета (дальтоников), пользователей с нарушением зрения и пользователей с вестибулярными расстройствами или другими неврологическими заболеваниями.

WCAG 1.4.1: Контрастность цветов

Объяснение требований к контрасту между фоном и текстом для обеспечения читабельности.

• Свойства CSS, которые являются частью других спецификаций:
  • accent-color
  • background-color
  • background-image
  • border-color
  • box-shadow
  • caret-color
  • color
  • color-scheme
  • column-rule-color
  • outline-color
  • scrollbar-color
  • text-decoration-color
  • text-emphasis-color
  • text-shadow
  • -webkit-tap-highlight-color
• Свойства SVG цвета, которые являются частью других спецификаций:
  • fill
  • flood-color
  • lighting-color
  • stop-color
  • stroke
• Атрибут SVG color
• Цветовой круг термин глоссария
• Интерполяция термин глоссария
• Правило @ @font-palette-values с описателем override-colors
• Правило @ @color-profile
• Функция @media color-gamut
• Функция @media forced-colors

• Модуль коррекции цвета CSS и свойство print-color-adjust.
• Модуль изображений CSS, в котором определяются изображения градиентов CSS <gradient>.
• Интерфейс VideoColorSpace
• Элемент SVG <feColorMatrix>
• API Canvas: применение стилей и цветов