Войти
Регистрация

Цвета в HTML

Цвета в HTML

Приветствую Вас, мои читатели!

Чтобы не омрачить ни один сайт отсутствием цвета и настроения, добавим в него немного красок.

Разберем цветовые схемы в HTML

Существуют несколько моделей представления цвета, но самой популярной является RGB. Эта модель содержит в себе 3 цвета : Red (красный), Green (зеленый), Blue (синий). И чтобы получить нужный цвет, необходимо каждый из этих трех цветов сочетать.

Цветов и их оттенков огромное количество и не стоит даже пытаться их запомнить.

При верстке сайтов в таблице стилей указывается цвет в виде шестизначного кода(HEX) в формате #RRGGBB, где вместо RR, GG и BB указываются значения цвета от 00 до FF.

Например: #00FFCC выглядит таким цветом

Цвета, помимо формата HEX, еще можно указывать в виде их названий. Ниже примеры, которые Вы можете запомнить:

redmaroonyellowolive
limegreenaquateal
bluefuchsiapurple
whitesilvergrayblack

Также, помимо формата HEX можно указывать цвет в формате RGB. Допустим красный цвет: rgb(255,0,0) - красный

Также можно сделать цвет более прозрачным. Тот же красный цвет, но прозрачнее: rgbа(255,0,0,0.5) - красный прозрачный

Здесь мы лишь добавили a, который отвечает за прозрачность и к параметрам цвета добавили четвертый - размер прозрачности в диапазоне от 0.1 до 1

В итоге можно использовать 3 варианта формата цвета:

  • Текстовый - их, к сожалению, не так много, но основные есть.
  • HEX - в формате 6-значного кода со знаком # в начале.
  • RGB - формат цвета не отличается от HEX, но поддерживает прозрачность.

У Вас, наверное, возник вопрос: Объяснил какие бывают цвета, а где их брать?

Отвечаю. В интернете полно сайтов с генераторами цветов. Но, чтобы облегчить Вам задачу, Вы сможете выбрать любой цвет через палитру здесь:

Кликните, чтобы открыть палитру

Водите мышкой по палитре для выбора цвета.

Для выбора цвета в формате RGB смотрите на значения: красный, зеленый, синий и подставляйте rgb(красный, зеленый, синий)

Как видите HTML цвета не так уж и сложны. Пользуйтесь на здоровье и делайте свои HTML страницы максимально интересными и яркими. Всего доброго! Увидимся в следующей статье.

С уважением, Самвел Погосов

Рекомендую к изучению мой бесплатный видеокурс по HTML и CSS для начинающих с подробными видеоуроками и заданиями: Перейти к видеокурсу

Комментарии к статье

Бесплатный видеокурс

HTML и CSS для начинающих

Практический и бесплатный курс по основам HTML и CSS для начинающих. С этим курсом Вы сможете изучить базовые понятия верстки и стилей CSS. Курс с практическими уроками и заданиями, все видеоуроки последовательны и увлекательны. Я научу Вас всему, чему научился сам.

Получить курс
Опрос

Для чего Вы изучаете HTML и CSS?