Названия цветов и оттенков. Определить цвет пиксела на картинке онлайн Цвет индиго в ворде

Палитра цветов и оттенков, используемая художниками и дизайнерами, просто поражает. А благодаря изменчивым тенденциям модницы всего мира также старательно изучают колористические схемы, как и модные журналы. Так, привычный всем желтый цвет при детальном рассмотрении делится на: горчичный, золотой, лимонный, шафрановый, канареечный, грушевый, кукурузный, шартрез, весенний бутон, георгиново-желтый, мандариновый, античный золотой… и это далеко не полный перечень его оттенков! Как разобраться в существующем разнообразии оттенков, и главное – нужно ли это вообще? Ведь восприятие цвета сугубо субъективно, на него влияют не только культурные факторы, но и физиологические (способность глаза различать нюансы цвета у разных людей неодинакова от природы). Кроме того, оттенок может казаться более теплым или холодным в зависимости от окружающих его цветов.

Холодные цвета и оттенки

Чтобы наглядно продемонстрировать непрерывность переходов цветов и оттенков, используется цветовой круг. В его основе три цвета: красный, желтый и синий. При смешивании этих цветов между собой мы получим промежуточные цвета: оранжевый, зеленый и фиолетовый. Все другие оттенки получаются смешиванием этих цветов между собой, а также с черным и белым.

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

Основой холодных цветов является голубоватый подтон. Если при взгляде на цвет, вы можете представить, что сквозь него просвечивает голубой, серый или – этот оттенок холодный.

Холодными оттенками являются:

• темно-красный;

• кошениль;

• алый;

• ализариновый;

• малиновый;

• кардинал;

• маджента;

• баклажан;

• глициния;

• лимонный;

• тауп;

• нефритовый;

• аквамарин;
• индиго;

• берлинская лазурь;

• гридеперлевый;

• антрацитовый;

• маренго.

Теплые оттенки цветов

Следует учитывать, что восприятие многих оттенков зависит от цветов, находящихся рядом. Выражение «все познается в сравнении» для температуры цвета весьма актуально. Даже среди оттенков одной температурной шкалы можно найти более теплые и более холодные. Проще всего сравнивать оттенки с нейтральным (к примеру, белым). Теплые оттенки цвета при этом будут иметь «отсвет» желтого, красного или розового.

К ним относятся:

Кроме того, существуют еще так называемые нейтральные цвета:

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

Для первого из них выбирают несколько оттенков одного и того же цвета. Этот способ подходит для создания сдержанных элегантных ансамблей.

Для второго сочетают смежные цвета (расположенные рядом на цветовом круге).

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

Как видите, стоит все-таки научиться различать теплые и холодные цвета и оттенки, а вот названия каждого из десятков тонов и полутонов выучивать наизусть вовсе не обязательно. Даже если вы стилист или дизайнер, проще будет носить с собой несколько цветовых палитр с названиями, чем постоянно держать цвета в памяти. Кроме того, гораздо проще показать пример цвета, нежели пытаться объяснить, в чем разница между, к примеру, индийским красным, лососевым и светло-коралловым.

Здравствуйте, уважаемые читатели блога сайт. Я продолжаю публиковать статьи в рубрике « ». Сегодня хочу поговорить про цвета в HTML и CSS коде, пояснить для тех, кто еще не в курсе, как можно их задать, каким образом они формируются, как для поиска или захвата нужного колора использовать специально предназначенные для этого программы и многое другое.

Вопрос задания нужного оттенка может быть особенно актуален для начинающих вебмастеров, когда не совсем понятны приводимые в web документе их коды (например, #f3af6c) и не понятно каким образом и откуда можно будет взять эту информацию (где найти таблицы Html и CSS цветов), и как их использовать для оформления текстового или какого-либо другого блока web документа.

Позволю себе вам напомнить, что мы уже успели познакомиться с основополагающими принципами, используемыми в . Так же мы уже рассмотрели теги и , узнали, узнали много и то, как .

Коды и таблица базовых RGB цветов

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

В модели RGB используются только три цвета (понятно, что это красный, зеленый и синий), каждый из которых может быть представлен с разным уровнем яркости свечения. Для каждого из каналов (красный, зеленый и синий) можно будет выбрать одну из 256 возможных градаций яркости. Число 256 взято по той причине, что столько значений оттенков можно закодировать в одном байте информации.

Соответственно, для своего web документа мы можем выбрать любой оттенок из огромного количества возможных (256*256*256). Например, для получения черного цвета нужно, чтобы у всех трех каналов цветовой схемы было нулевое значение яркости, а для получения белого — красный, зеленый и синий цвета должны иметь максимальную яркость.

Давайте теперь попробуем разобраться, как задать яркость в каждом канале и сколько у нас есть для этого возможностей?

На самом деле, есть два основных способа :

1. задание с помощью записи яркости по каждому из каналов (красному, зеленому и синему) в шестнадцатеричной системе счисления
2. задание с помощью ввода названия цвета в коде web документа

Давайте начнем со сложного и попробуем разобраться с записью цветов в шестнадцатиричном коде. Если бы мы хотели, например, записать код белого в десятичной системе, то получили бы код 256 256 256, а для черного — 0 0 0. Тут, наверное, все понятно.

Но в шестнадцатеричной системе счисления кроме арабских цифр используются еще и первые шесть букв латинского алфавита, ну и есть своя специфика формирования цифр. Углубляться в это, думаю, не стоит, но для примера скажу, что белый для Html можно будет задать так: #ffffff, а черный так: #000000. Т.е. 00 соответствует 0 в десятичной системе счисления, а ff соответствует 256.

Т.е. на каждый канал RGB цвета в CSS коде отводится две шестнадцатеричных цифры, поэтому записи значения цвета состоят из шести цифр (или букв, которые приравнены к цифрам в шестнадцатеричной системе), перед которыми ставится знак решетки «#». Все довольно просто.

Например, в приведенной таблице для простейших оттенков их шестнадцатиричные записи будут выглядеть так:

Естественно, что вы не обязаны сами придумывать и сопоставлять шестнадцатиричные коды оттенков с теми, что вы хотите увидеть на своем интернет проекте. Подбирать колор для сайта вы можете в любом графическом редакторе (даже в ), где вам обязательно покажут запись этого оттенка в формате RGB, или найти таблицу Html цветов и скопировать нужный вам код оттуда.

Яндекс Цвета — подбор RGB палитры оттенков в выдаче Yandex

Не хотите использовать для этой цели графический редактор или искать таблицу с кодами? Нет проблем. Прокрутите немного вниз эту страницу и вы найдете массу специфических и заточенных именно для работы с цветом в Html или CSS коде программ.

Если и это вам не подходит, то откройте просто и введите в поисковую строку запрос с названием того оттенка , который вам интересен (хотя, можно ввести просто: серобуромалиновый).

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

Все это реализуется благодаря так называемому , который призван помочь верстальщикам и дизайнерам.

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

Собственно, этот инструмент может пригодиться и обычным пользователям интернета, например, для того, чтобы понять, как же все-таки будет выглядеть мебель оттенка сер-бур-малин-в-крапинку. Можете посмотреть так же видео про использование этого колдунщика Яндекса:

Некоторые цвета в языке гипертекстовой разметки могут быть заданны с помощью слов , например, «black» означает черный, «white» — белый и т.д. Но тут есть один нюанс. Задание колора, таким образом, возможно только для ограниченного их числа.

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

Во-вторых, в валидаторе W3C для спецификации языка гипертекстовой разметки 4.01 (ее в полной мере поддерживают все возможные браузеры на текущий момент) определено только 16 колоров, которые в Html или CSS коде можно задавать словами:

Вы можете встретить и гораздо более развернутые таблицы оттенков, которые можно будет задать в коде словами, но там существует вероятность, что в каком-нибудь браузере данный цвет будет отображаться не корректно.

Поэтому, кроме приведенной чуть выше таблицы 16 базовых оттенков, все остальные цвета следует задавать в коде web документов только с помощью шестнадцатеричной записи, во избежании никому не нужных эксцессов.

Использование кодов и названий цветов в вебмастеринге

На данный момент все внешнее оформление web страниц отдано на откуп CSS (таблицам каскадных стилей) и указание кода цвета непосредственно в Html встречается крайне редко, но все же встречается. К тому же бывают ситуации, когда нельзя по тем или иным причинам использовать внешние таблицы стилей CSS (например, в случае создания выпуска ).

Поэтому я все же приведу пример задания цвета в Html, хотя при этом и будут использоваться уже не рекомендованные валидатором W3C теги . Например, раньше колор для фона задавали в теге «BODY» через атрибут «bgcolor», а текст раскрашивали сразу на всей вебстранице с помощью атрибута «text».

Задание нужных оттенков в таком случае могло выглядеть, например, так:

Содержимое документа

В результате вы получите вебстраницу с бежевым фоном и темно-синим шрифтом. До того, как CSS вошел в обиход, для изменения цвета шрифта какого-либо отдельного участка текста повсеместно использовали сейчас уже не рекомендуемый валидатором W3C тег «FONT», в который для задания колора включали одноименный атрибут «color»:

участок текста, который нужно было окрасить в синий колор

Для того, чтобы увидеть результат работы написанного кода на экране, вам нужно сохранить этот файл с расширением html, а затем открыть его в любом удобном для вас браузере.

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

Как вы можете видеть, иногда для сокращения записи оттенка используют не шесть знаков, а только три, в том случае, если они совпадают для каждого канала — «#6с0» вместо «#66сс00».

Выбор цвета из палитры специальной программы или захват его с экрана

Как я уже писал чуть выше, повсеместно используется RGB (красный, зеленый, синий) цветовая схема. Для каждого из трех основных колоров предусмотрено 256 градаций – от 0 до 255 (если перевести эти значения в шестнадцатеричную систему счисления, то получим – от 00 до FF).

Т.к. у нас три основных колора, из комбинации которых формируются все остальные оттенки, то шестнадцатиричная запись будет иметь примерно такой вид: 99FF66 (оттенок зеленого). Добавив перед ним # получим код #99FF66, который можно использовать как в Html, так и в стилевых файлах. Само собой разумеется, что вы сами не должны вычислять и помнить всю эту абрукадабру.

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

Вот список программ, которые позволяют все это реализовать в полной мере:

Удачи вам! До скорых встреч на страницах блога сайт

Вам может быть интересно

Списки в Html коде - теги UL, OL, LI и DL
Как вставить в HTML ссылку и картинку (фото) - теги IMG и A
Как создать гиперссылку (А, Href, Target blank), как открывать ее в новом окне на сайте, а так же сделать картинку ссылкой в Html коде
Теги Font (Face, Size и Color), Blockquote и Pre - устаревшее форматирование текста в чистом HTML (без использования CSS)
Таблицы в Html - теги Table, Tr и Td, а так же Colspan, Cellpadding, Cellspacing и Rowspan для их создания
Html формы для сайта - теги Form, Input и Select, Option, Textarea, Label и другие для создания элементов вебформ Select, Option, Textarea, Label, Fieldset, Legend - теги Html формы выпадающих списков и текстового поля
Img - Html тег для вставки картинки (Src), выравнивания и обтекание ее текстом (align), а так же задания фона (background)
Директивы комментариев и Doctype в Html коде, а так же понятие блочных и строчных элементов (тэгов)
Что такое язык гипертекстовой разметки Html и как посмотреть список всех тэгов в валидаторе W3C
Пробельные символы и форматирование ими кода в Html, а так же спецсимволы неразрывного пробела и другие мнемоники

Модуль CSS color подробно описывает значения, которые позволяют авторам определять цвета и непрозрачность html-элементов, а также значения свойства color .

Свойство color

1. Приоритетные цвета: свойство color

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

Свойство наследуется.

2. Значения цвета

2.1. Основные ключевые слова

Список основных ключевых слов включает в себя следующие значения:

Названия цветов не чувствительны к регистру.

Синтаксис

Color: teal;

2.2. Числовые значения цвета

2.2.1. Цвета модели RGB

Формат значения RGB в шестнадцатеричном формате — это знак # , за которым сразу следуют три или шесть шестнадцатеричных символов. Трехзначная запись RGB #rgb преобразуется в шестизначную форму #rrggbb путем копирования цифр, а не путем добавления нулей. Например, #fb0 расширяется до #ffbb00 . Это гарантирует, что белый #ffffff может быть указан в короткой записи #fff , и удаляет любые зависимости от глубины цвета дисплея.

Формат значения RGB в функциональной нотации — rgb(, за которым следует разделенный запятыми список из трех числовых значений (либо трех целочисленных значений, либо трех процентных значений), за которыми следует символ) . Целочисленное значение 255 соответствует 100% и F или FF в шестнадцатеричной записи:

Rgb (255,255,255) = rgb (100%, 100%, 100%) = #FFF

Символы пробела допускаются вокруг числовых значений.