Что это — таблица цветов HTML, и для чего она нужна?
Оформляя сайт, особенно разрабатывая его дизайн с нуля, многие сталкиваются с такой проблемой, как раскрашивание страницы сайта, таблиц, текста. Во многих конструкторах сайтов есть специальные модули и кнопки, с помощью которых и задаются данные параметры. Но далеко не все они обладают широким функционалом. Вот тут-то и приходит на помощь таблица цветов HTML.
Что такое таблица цветов
В программировании, вне зависимости от языка, многие команды и параметры задаются специальными короткими обозначениями. Не стал исключением и язык HTML-разметки. Он имеет достаточно широкий набор команд и обозначений.
Для того чтобы раскрасить элемент страницы или текста в нужный оттенок, следует знать о таком понятии, как таблица HTML-кодов цветов. В ней содержатся основные коды того или иного цвета или оттенка. Использовав их, можно задать тон любого элемента, прописав его в определенном тэге.
Код в таблице передается с помощью шестнадцатеричной системы. Каждый цвет состоит из шести символов. Каждая пара символов обозначает интенсивность того или иного цвета. Первая из них отвечает за красный цвет, вторая – за зеленый, третья – за синий.
Код цвета всегда начинается со знака решетки (#). Например, код черного будет выглядеть так: «#000000».
Стоит отметить, что некоторые веб-мастера используют укороченный вариант кода, используя всего лишь три символа – по одному из пары. Но все же мы рекомендуем вам применять общепринятые обозначения.
Какие бывают таблицы цветов для HTML
Таблица цветов HTML представлена в нескольких вариантах. Первый — базовые цвета. Их всего шестнадцать. Сюда относятся такие цвета, как красный, серый, серебристый, белый, черный, зеленый, синий, голубой, желтый и прочие. Их довольно удобно использовать для оформления текста, так как все они достаточно насыщенные и яркие. Далее можно выделить так называемую «Таблицу безопасных цветов», которая насчитывает 216 оттенков, отображаемых на любой видеокарте. Эту таблицу довольно легко найти в любом учебнике по HTML. Стоит отметить, что она подойдет в том случае, если вы занимаетесь непосредственно дизайном сайта или страницы, и вам нужны именно оттенки цветов — как насыщенные, так и довольно легкие и едва заметные.
Также позволим себе выделить таблицу оттенков серого цвета, которая содержит более 10 вариантов. Она также подойдет для дизайна сайта, в особенности для фона-подложки под основной текст. Любые из этих кодов можно использовать и в том случае, если вам нужно задать цвет текста в таблице HTML для сносок или мелких приписок.
Чем заменить?
Что делать, если под рукой нет таблицы цветов? Этот вариант исключать нельзя, даже несмотря на то, что она довольно широко используется и относится к открытой и доступной информации.
Если у вас нет возможности найти данный материал, можно записать цвет в процентном соотношении. При этом знак решетки вам не потребуется. Но задавать оттенок таким способом довольно трудно и муторно, так как вы никогда не будете знать заранее, что у вас может получиться. Запись в таком формате может выглядеть примерно так: «10P %». Однако такой способ записи цвета мы не рекомендуем. Таблица цветов HTML будет намного надежнее, чем такие эксперименты.
Третий способ задать цвет – написать его название на английском. В основном браузеры читают и адекватно воспринимают названия основных цветов, а также их оттенков, помеченных значениями dark (темно), light (светло). К примеру, черный цвет задается как Black, а темно-красный – DarkRed.
Выводы
Таблица цветов HTML – одна из наиболее важных вещей, о которых стоит знать веб-дизайнерам. С ее помощью можно «раскрасить» страницы сайта, текст, таблицы и прочие элементы.
Таблица содержит наиболее употребляемые цвета и их коды, состоящие из трех пар знаков, обозначающих интенсивность красного, зеленого и синих цветов. Найти ее можно в любом учебнике по HTML.
В случае если у вас под рукой нет таблицы, можно задать цвет, используя его название на английском языке.
Таблица цветов CSS с английским названием и кодом
- HTML и CSS
- CSS3 shape-outside или обтекание картинки текстом
- Маштабируемый фон background css
- CSS выравнивание по вертикали
- Хранение картинок в css с помощью base64
- Как сделать ссылку, якорь?
- CSS3 для Internet Explirer 6 и старше
- Вёрстка для мобильных устройств
- Растягиваем html на всю страницу
- Таблица цветов CSS
- Выравнивание тега LI в контенте
- Оооох какой прекрасный box-sizing
- Делаем таблицу при помощи div и css
- Как сделать кросбраузерный linear-gradient без особых усилий
- CSS прозрачность для всех
- CSS для печати @media print
- Выравнивание блоков с помощью css {display: inline-block}
- Замечательное значение inherit
- Тень блочных элементов в CSS3
- Обводка текста с помощью CSS
- Полезные html символы
- Хаки или CSS для Internet Explorer-ов
- Делаем трёхуровневое меню на css
- jQuery, javaScript
- Устанавливаем на Яндекс Карте свою картинку вместо стандартной метки
- Адаптивные фотогалереи, слайдеры, карусели для сайта
- Узнаём координаты для установки скрипта Яндекс Карт
- Собственный фильтр для селекторов. Выбираем случайный элемент на jQuery
- closeClick true fancyBox 2, closeClick :true
- jquery ui slider, дробные числа, float values
- Парсер параметров из адресной строки jQuery
- Подсказки по javascript
- Выпадающее горизонтальное меню
- Работа с объектами в JavaScript: теория и практика
- Работа с массивами в jquery
- PHP
- Регулярные выражения онлайн
- Как определить путь к файлу текущего класса
- PHP скрипт для поиска. Удаление вируса с сайта
- UMI-CMS
- UMI CMS rel canonical
- UMI CMS API Шаблоны данных Вывести текст из подсказки
- UMI CMS API Шаблоны данных Добавить префикс к полю
- Если надо в UMI CMS открыть доступ к файлу в корне сайта htaccess
- Как перенести контент со старой UMI на новую UMI CMS с помощью umiDump
- Отправка письма с вложением UMI CMS API
- Как вывести из набор изображений одну картинку UMI CMS API (или случайную)
- UMI CMS Основные поля для отправки формы в модуле Конструктор форм
- Функции API UMI CMS для добавления, редактирования, удаления объектов каталога
- Функции API UMI CMS для добавления, редактирования, удаления объектов каталога
- UMI CMS Фильтрация спама на сайте
- Работа с набором изображений (multiple_image) TPL в UMI. CMS
- UMI CMS Ошибка «I expect value in request for param»
- UMI.CMS USEL кириллица не работает
- UMI Добавление дополнительных настроик на примере модуля catalog
- Подключение шаблонов в UMI.CMS в TPL шаблонизаторе
- UMI.CMS — забыл пароль администратора. Как восстановить?
- UMI Selector USEL фильтрация в PHP
- Передать в xslt xpath в запросе знак амперсанда
- Работа с system makeThumbnail
- Вывести названия методов в UMI
- UMI CMS API загрузка модуля
- UMI CMS карта сайта с помощью Usel
- UMI выгрузка из 1C поиск страницы копии, удаление копии
- Как в UMI.CMS изменить адрес домена в sitemap.xml и robots.txt. Изменить HTTP на HTTPS
- Вывод баннеров/слайдера в umi xslt
- UMI.CMS нет вкладок в админке
- XSLT вывод ссылки в которой присутствует знак амперсанда &
- UMI CMS Выгрузка из 1С нужно чтобы название товара (страницы каталога) не менялось
- Как в UMI поставить всем страницам галку на просмотр гостю
- Как узнать у страницы id шаблона данных через api?
- UMI. CMS работа с debug config.ini фильтрация по IP
- Как задать заголовок h2 (header) на странице созданного метода UMI CMS
- Выводим случайную статью в UMI CMS с помощью usel в tpl
- UMI.CMS Открыть закрытые поля в шаблонах данных ?skip-lock=1
- Как отредактировать облако тегов
- Как узнать позицию страницы среди соседних страниц в UMI
- umi cms usel вывод страниц каталога c фильтрацией
- Вывод справочника при помощи usel
- Как в umi узнать umiHierarchyElement из id umiObject
- Карта сайта на UMI CMS с помощью кастомного метода
- Редирект со страницы на страницу
- Создание, обслуживание, поддержка сайта
- Как удалить в картинке jpg, jpeg, gif? eval или base64_decode
- Основные технические ошибки, допускаемые при создании сайта
- Как выбрать домен?
- Хостинг, что это и для чего он нужен
- htaccess редиректы
- Наполнение сайта
- Цены на разработку сайта в Петербурге
- Какова может быть стоимость поддержки сайта?
- Важные мелочи!
- Каким должен быть сайт по версии яндекса
- 5 советов верстальщику
- Копирайтинг, seo, продвижение
- Ранжирование сайтов в поисковиках, выдача поисковых систем, поисковый алгоритм, поисковое ранжирование сайта
- Что нужно делать чтобы сайт был на первых местах?
- Копирайтинг — что это?
- Добавить сайты в индекс поисковых систем, регистрация в поисковиках
- Почему сайт не может приносить прибыль сразу?
- Почему следует вкладывать деньги в сайт?
- SEO статья о SEO-копирайтинге (seo copyrighting, seo copywriting). Кто seo копирайтер, что такое seo текст сайта, как помогают seo статьи и зачем нужна оптимизация?
- Как верстать сайт для SEO?
- Контекстная реклама
- О контекстной рекламе
- Контекстная реклама Яндекс.Директ
Цветовая константа | RGB | Образец |
---|---|---|
alicemblue | F0F8FF | |
antiquewhite | FAEBD7 | |
aqua | 00FFFF | |
aquamarine | 7FFFD4 | |
azure | F0FFFF | |
beige | F5F5DC | |
bisque | FFE4C4 | |
black | 000 | |
blanchedalmond | FFEBCD | |
blue | 00F | |
blueviolet | 8A2BE2 | |
brown | A52A2A | |
burlywood | DEB887 | |
cadetblue | 5F9EA0 | |
chartreuse | 7FFF00 | |
chocolate | D2691E | |
coral | FF7F50 | |
cornflowerblue | 6495ED | |
cornsilk | FFF8DC | |
crimson | DC143C | |
cyan | 0FF | |
darkblue | 00008B | |
darkcyan | 008B8B | |
darkgoldenrod | B8860B | |
darkgray | A9A9A9 | |
darkgreen | 006400 | |
darkkhaki | BDB76B | |
darkmagenta | 8B008b | |
darkolivegreen | 556B2F | |
darkorange | FF8C00 | |
darkochid | 9932CC | |
darkred | 8B0000 | |
darksalmon | E9967A | |
darkseagreen | 8FBC8F | |
darkslateblue | 483D8B | |
darkslategray | 2F4F4F | |
darkturquoise | 00CED1 | |
darkviolet | 9400D3 | |
deeppink | FF1493 | |
deepskyblue | 00BFFF | |
dimgray | 696969 | |
dodgerblue | 1E90FF | |
firebrick | B22222 | |
floralwhite | FFFAF0 | |
forestgreen | 228B22 | |
fushsia | F0F | |
gainsboro | DCDCDC | |
ghostwhite | F8F8FF | |
gold | FFD700 | |
goldenrod | DAA520 | |
gray | 808080 | |
green | 008000 | |
greenyellow | ADFF2F | |
honeydew | F0FFF0 | |
hotpink | FF69B4 | |
indiandred | CD5C5C | |
indigo | 4B0082 | |
ivory | FFFFF0 | |
khaki | F0E68C | |
lavender | E6E6FA | |
lavenderblush | FFF0F5 | |
lawngreen | 7CFC00 | |
lemonchiffon | FFFACD | |
ligtblue | ADD8E6 | |
lightcoral | F08080 | |
lightcyan | E0FFFF | |
lightgoldenrodyellow | FAFAD2 | |
lightgreen | 90EE90 | |
lightgrey | D3D3D3 | |
lightpink | FFB6C1 | |
lightsalmon | FFA07A | |
lightseagreen | 20B2AA | |
lightscyblue | 87CEFA | |
lightslategray | 789 | |
lightsteelblue | B0C4DE | |
lightyellow | FFFFE0 | |
lime | 0F0 | |
limegreen | 32CD32 | |
linen | FAF0E6 | |
magenta | FF00FF | |
maroon | 800000 | |
mediumaquamarine | 66CDAA | |
mediumblue | 0000CD | |
mediumorchid | BA55D3 | |
mediumpurple | 9370DB | |
mediumseagreen | 3CB371 | |
mediumslateblue | 7B68EE | |
mediumspringgreen | 00FA9A | |
mediumturquoise | 48D1CC | |
medium violetred | C71585 | |
midnightblue | 191970 | |
mintcream | F5FFFA | |
mistyrose | FFE4E1 | |
moccasin | FFE4B5 | |
navajowhite | FFDEAD | |
navy | 000080 | |
oldlace | FDF5E6 | |
olive | 808000 | |
olivedrab | 6B8E23 | |
orange | FFA500 | |
orengered | FF4500 | |
orchid | DA70D6 | |
palegoldenrod | EEE8AA | |
palegreen | 98FB98 | |
paleturquose | AFEEEE | |
palevioletred | DB7093 | |
papayawhop | FFEFD5 | |
peachpuff | FFDAB9 | |
peru | CD 853F | |
pink | FFC0CB | |
plum | DDA0DD | |
powderblue | B0E0E6 | |
purple | 800080 | |
red | F00 | |
rosybrown | BC8F8F | |
royalblue | 4169E1 | |
saddlebrown | 8B4513 | |
salmon | FA8072 | |
sandybrown | F4A460 | |
seagreen | 2E8B57 | |
seashell | FFF5EE | |
sienna | A0522D | |
silver | C0C0C0 | |
skyblue | 87CEEB | |
slateblue | 6A5ACD | |
slategray | 708080 | |
snow | FFFAFA | |
springgreen | 00FF7F | |
steelblue | 4682B4 | |
tan | D2B48C | |
teal | 008080 | |
thistle | D8BFD8 | |
tomato | FF6347 | |
turquose | 40E0D0 | |
violet | EE82EE | |
wheat | F5DEB3 | |
white | FFF | |
whitesmoke | F5F5F5 | |
yellow | FF0 | |
yellowgreen | 9ACD32 |
Таблица таблиц цветов в цветовом пятне на HTML Station
Таблицы цветов в цветовом пятне
Эта таблица поможет вам выбрать таблицу цветов в The Color Spot. В ячейках ссылки ведут к таблице, показывающей набор цветов, указанных в первом столбце строки, и отображающих коды в заголовке столбца.
Набор цветов в таблице | Коды указаны в таблице | ||||||
---|---|---|---|---|---|---|---|
Имя | RGB Hex | RGB Decimal | Процент RGB | HSL | CMYK | Специальный | |
Большой список из 1000+ цветов с описательными названиями | Шестигранная втулка Мобильная шестигранная втулка Шестнадцатеричный Таблица кодов Таблица кодов Компактная Таблица кодов для мобильных устройств Шестигранные чипы | Десятичный Таблица кодов | Процент Таблица кодов | Таблица кодов HSL | CMYK Таблица кодов | ||
16 именованных цветов | 16 Имя | 16 Имя 16 кодов | 16 Имя 16 кодов | 16 Имя 16 кодов | 16 Имя 16 кодов | 16 кодов | HSLA RGBA Декабрь RGBA % |
216 безопасных цветов | Шестигранный сейф Коды безопасности | Коды безопасности | Коды безопасности | Коды безопасности | Коды безопасности | ||
12 мягких цветов | Шестигранник Мягкий Коды безопасности | Коды безопасности | Коды безопасности | Коды безопасности | Коды безопасности | ||
147 Масштабируемая векторная графика названных цветов | SVG Названный SVG в SVG | Шестнадцатеричный SVG | SVG Десятичный | Процент SVG | SVG HSL | SVG CMYK | |
267 блоков универсального языка цветов | Шестнадцатеричный UCL | Манселл | |||||
Цвета, генерируемые с фиксированными интервалами | Шестигранник 30° Шестигранник 10° Шестигранник 6° Шестигранник Тройной Цветовые оттенки | Стол HSL 30° Стол HSL 10° Стол HSL 6° | CMYK оттенки | ||||
Пользовательские цвета, созданные с помощью интерактивных инструментов | Swatch Control Scheme Maker Hex Stepper Hue Stepper Chooser Picker | Swatch Control Селектор Селектор | Swatch Control Scheme Maker Hue Stepper |
Этикетки в таблицах цветов
Слова после названия цвета | . ..означает значение цвета… |
---|---|
сейф | в списке безопасных цветов |
16 | в списке 16 именованных цветов под именем, показанным здесь |
16=ЦВЕТ | в списке 16 именованных цветов под названием ЦВЕТ |
SVG | в списке именованных цветов SVG под именем, показанным здесь |
SVG=COLOR | в списке именованных цветов SVG под названием COLOR |
Hex3 | выражается тройным шестнадцатеричным кодом |
Цветное пятно Справочная информация
- Условия
- Определения
- Названия цветов
- Использование цветовых оттенков для настройки цветовых схем
- Использование сгенерированных чипов для настройки цветовых схем
- Ссылки на дополнительную информацию
- Книги по теории и использованию цвета
Теги HTML/таблицы/цвет фона — индекс тега
Браузер | |
---|---|
Тип |
|
Атрибут bgcolor элементов TABLE, TR и TD (TH) указывает цвет фона таблицы.