Въведение в имената на цветовете HTML
HTML имената на цветовете са правилно обозначени в ал. Цветовете са важни не само, че се използват за украса на уеб страница, но в някои случаи може да искате да промените цвета на текста, за да осигурите по-добър контраст на фона на страницата. Като се има предвид, че HTML е написан в текстова форма, не можете просто да оцветите кода по ваш вкус и да очаквате уеб браузъра да използва същия цвят, когато изобразява страницата. Вместо това ще трябва да прибягвате до използването на тагове и атрибути, за да кажете на браузъра кой цвят да използва.
Цветове в HTML
В HTML имена на цветове цветовете могат да бъдат обозначени с помощта на шестнадесетичната им стойност или нейното име. HTML има поддръжка за най-често срещаните цветове, в тази статия ще споделя с вас 140 имена и шестнадесетични стойности на тези цветове.
Едно нещо, което трябва да имате предвид, е, че не е нужно да се ограничавате в тези цветове, можете да използвате всеки инструмент за избор на цвят, за да намерите шестнадесетична стойност на всеки цвят и да го използвате на своята уеб страница.
Използване на HTML имена на цветове
Внедряването на цветове на вашата уеб страница е лесно и може да се извърши както на линия, така и чрез отделен CSS таблица за стилове.
Когато ще използвате едни и същи HTML имена на цветове на страница няколко пъти, е по-добра идея да използвате CSS Sheet за определяне и задаване на цветове. И обратно, ако трябва да използвате цвят само веднъж или два пъти, използването на вградения метод се счита за по-добро.
1. Използване на HTML Color Inline
Brown H3 Heading
Gainsboro colored paragraph text
Brown H3 Heading
Gainsboro colored paragraph text
Brown H3 Heading
Gainsboro colored paragraph text
Brown H3 Heading
Gainsboro colored paragraph text
Brown H3 Heading
Gainsboro colored paragraph text
Brown H3 Heading
Gainsboro colored paragraph text
2. Изпълнение в CSS
h1 ( color: Brown; )
p ( color: Gainsboro; )
Различни HTML имена на цветове
Сега, когато знаете какво представляват HTML имената на цветовете и как можете да ги използвате в своите страници, ето линк от имена на цветове, които можете да маркирате и използвате във вашите проекти:
1. Сиви и черни HTML имена на цветове
Сивите и черните цветове в повечето случаи са идеални за цвета на текста на страницата, тъй като на бял фон тези цветове имат най-добра четимост. Едно интересно нещо, което трябва да се има предвид, е, че съвременните телефони с готови OLED дисплеи се нуждаят от енергия на батерията, за да покажат черен цвят, ако аудиторията ви ще е на мобилен телефон, е разумна идея да използвате черния цвят като цвят на фона и бяла или друга светлина цветове като цвят на преден план.
код | цвят |
# 000000 | черно |
# 0C090A | нощ |
# 2C3539 | Gunmetal |
# 2B1B17 | полунощ |
# 34282C | дървени въглища |
# 25383C | Тъмно шисти сиво |
# 3B3131 | масло |
# 413839 | Черна котка |
# 3D3C3A | иридий |
# 463E3F | Черна змиорка |
# 4C4646 | Черна крава |
# 504A4B | Сив вълк |
# 565051 | Вампир Грей |
# 5C5858 | Сив делфин |
# 625D5D | Карбоново сиво |
# 666362 | Пепел Грей |
# 6D6968 | Облачно сиво |
# 726E6D | Smokey Grey |
# 736F6E | сив |
# 837E7C | гранит |
# 848482 | Боен кораб сив |
# B6B6B4 | Сив облак |
# D1D0CE | Сива гъска |
# E5E4E2 | платина |
# BCC6CC | Метално сребро |
# 98AFC7 | Синьо сиво |
# 6D7B8D | Светло шисто сиво |
# 657383 | Шифер Сив |
# 616D7E | Джет Грей |
2. Сини HTML имена на цветове
Синият подчертан текст се счита за линк, тъй като това е стилът на връзката по подразбиране за повечето уеб браузъри, трябва да избягвате използването на синьо за целия текст на страницата, тъй като посетителите могат да го сбъркат за хипервръзки.
# 646D7E | Mist Blue |
# 566D7E | Мраморно синьо |
# 737CA1 | Slate Blue |
# 4863A0 | Стоманено синьо |
# 2B547E | Синя сойка |
# 2B3856 | Тъмно шисти синьо |
# 151B54 | Среднощно синьо |
# 000080 | Тъмносин |
# 342D7E | Синият кит |
# 15317E | Lapis Blue |
# 151B8D | Деним тъмно син |
# 0000A0 | Земно синьо |
# 0020C2 | Кобалтово синьо |
# 0041C2 | Blueberry Blue |
# 2554C7 | Сапфирено синьо |
# 1569C7 | Сини очи |
# 2B60DE | Кралско синьо |
# 1F45FC | Синя орхидея |
# 6960EC | Син лотос |
# 736AFF | Светло шистов син |
# 357EC7 | Windows Blue |
# 368BC1 | Ледников син лед |
# 488AC7 | Копринено синьо |
# 3090C7 | Син бръшлян |
# 659EC7 | Син Кой |
# 87AFC7 | Columbia Blue |
# 95B9C7 | Бебешко синьо |
# 728FCE | Светло стоманено синьо |
# 2B65EC | Океанско синьо |
# 306EFF | Синя панделка |
# 157DEC | Синя рокля |
# 1589FF | Dodger Blue |
# 6495ED | Царевично синьо |
# 6698FF | Небесно синьо |
# 38ACEC | Пеперуда синьо |
# 56A5EC | айсберг |
# 5CB3FF | Кристално синьо |
# 3BB9FF | Дълбоко небесно синьо |
# 79BAEC | Деним синьо |
# 82CAFA | Светло небесно синьо |
# 82CAFF | Ден небесно синьо |
# A0CFEC | Дънки сини |
# B7CEEC | Син ангел |
# B4CFEC | Пастелно синьо |
# C2DFFF | Морско синьо |
# C6DEFF | Прахово синьо |
#AFDCEC | Коралово синьо |
#ADDFFF | Светло синьо |
#BDEDFF | Robin Egg Blue |
#CFECEC | Бледо синя лилия |
# E0FFFF | Светъл циан |
# EBF4FA | вода |
# F0F8FF | AliceBlue |
# F0FFFF | лазурен |
#CCFFFF | Лек шисти |
# 93FFE8 | Лек аквамарин |
# 9AFEFF | Електрическо синьо |
# 7FFFD4 | аквамарин |
# 00FFFF | Циан или Аква |
# 7DFDFE | Трон синьо |
# 57FEFF | Син циркон |
# 8EEBEC | Синя лагуна |
# 50EBEC | Селесте |
# 4EE2EC | Син диамант |
# 81D8D0 | Тифани Синьо |
# 92C7C7 | Cyan Opaque |
# 77BFC7 | Синя хоста |
# 78C7C7 | Северно синьо синьо |
# 48CCCD | Среден тюркоаз |
# 43C6DB | тюркоаз |
# 46C7C7 | медуза |
# 7BCCB5 | Синьозелено |
3. Зелени HTML цветове
В сайтове, свързани с природата, парите, околната среда и т.н., зеленото може да бъде добър избор на цвят, който да използвате като фон.
# 43BFC7 | Мака синьо зелено |
# 3EA99F | Светло морско зелено |
# 3B9C9C | Тъмно тюркоаз |
# 438D80 | Морска костенурка Зелена |
# 348781 | Среден аквамарин |
# 307D7E | Зеленикаво синьо |
# 5E7D7E | Сивкав тюркоаз |
# 4C787E | Beetle Green |
# 008080 | примкар |
# 4E8975 | Морско зелено |
# 78866B | Камуфлажен зелен |
# 848b79 | Градински чай |
# 617C58 | Лешниково зелено |
# 728C00 | Venom Green |
# 667C26 | Папрат Зелен |
# 254117 | Тъмно горско зелено |
# 306754 | Средно морско зелено |
# 347235 | Средно горско зелено |
# 437C17 | Морски водорасли зелени |
# 387C44 | Pine Green |
# 347C2C | Джунгла зелено |
# 347C17 | Shamrock Green |
# 348017 | Средно пролетно зелено |
# 4E9258 | Горско зелено |
# 6AA121 | Зелен лук |
# 4AA02C | Пролетно зелено |
# 41A317 | Лайм зелен |
# 3EA055 | Детелина зелена |
# 6CBB3C | Зелена змия |
# 6CC417 | Извънземно зелено |
# 4CC417 | Зелена ябълка |
# 52D017 | Жълто зелен |
# 4CC552 | Кели Грийн |
# 54C571 | Zombie Green |
# 99C68E | Жаба зелена |
# 89C35C | Зелен грах |
# 85BB65 | Долар Бил Грийн |
# 8BB381 | Тъмно морско зелено |
# 9CB071 | Игуана Грийн |
# B2C248 | Авокадо зелено |
# 9DC209 | Шам фъстък зелен |
# A1C935 | Салата зелена |
# 7FE817 | Колибри Зелено |
# 59E817 | Мъглявина зелена |
# 57E964 | Stoplight Go Green |
# 64E986 | Водорасли Зелени |
# 5EFB6E | Джейд Грийн |
# 00FF00 | зелен |
# 5FFB17 | Изумрудено зелено |
# 87F717 | Тревна зелена |
# 8AFB17 | резеда |
# 6AFB92 | Драконово зелено |
# 98FF98 | ментово зелено |
# B5EAAA | Зелен палец |
# C3FDB8 | Лек нефрит |
# CCFB5D | Чай зелен |
# B1FB17 | Зелено жълто |
# BCE954 | Slime Green |
# EDDA74 | Goldenrod |
# EDE275 | Реколта злато |
# FFE87C | Слънце жълто |
4. Жълти HTML имена на цветове
Жълтото може да се използва за задаване на несериозно настроение, показване на креативност и оптимизъм в една страница. Имайте предвид, че жълтото работи по-добре като фон, отколкото цвят на текста.
# FFFF00 | жълт |
# FFF380 | Царевично жълто |
# FFFFC2 | пергамент |
#FFFFCC | сметана |
# FFF8C6 | Лимон шифон |
# FFF8DC | свила |
# F5F5DC | бежов |
# FBF6D9 | Рус |
# FAEBD7 | AntiqueWhite |
# F7E7CE | шампанско |
#FFEBCD | BlanchedAlmond |
# F3E5AB | ванилия |
# ECE5B6 | Тан Браун |
# FFE5B4 | праскова |
# FFDB58 | горчица |
# FFD801 | Гума Ducky Yellow |
# FDD017 | Ярко злато |
# EAC117 | Златисто кафяво |
# F2BB66 | Макарони и сирене |
# FBB917 | шафран |
# FBB117 | Бира |
# FFA62F | пъпеш |
# E9AB17 | Пчелно жълто |
5. Кафяви HTML цветове
Кафявият фон може да затрудни четенето на бял или черен текст, можете да прибягвате до други цветове, които имат добър контраст спрямо вашия нюанс на кафявото.
# E2A76F | Кафява захар |
# DEB887 | BurlyWood |
# FFCBA4 | Дълбока праскова |
# C9BE62 | Джинджифил Браун |
# E8A317 | Училищен автобус жълт |
# EE9A4D | Санди Браун |
# C8B560 | Fall Leaf Brown |
# D4A017 | Оранжево злато |
# C2B280 | Пясък |
# C7A317 | Бисквитка Браун |
# C68E17 | карамел |
# B5A642 | месинг |
# ADA96E | каки |
# C19A6B | Камил кафяв |
# CD7F32 | бронз |
# C88141 | Тигър портокал |
# C58917 | канела |
# AF9B60 | Куршумна черупка |
# AF7817 | Тъмният Голдрод |
# B87333 | мед |
# 966F33 | дърво |
# 806517 | Дъб кафяв |
# 827839 | цървул |
# 827B60 | Армия Браун |
# 786D5F | пясъчник |
# 493D26 | мока |
# 483C32 | тъмнокафяв |
# 6F4E37 | кафе |
# 835C3B | Кафява мечка |
# 7F5217 | Червена мръсотия |
# 7F462C | сепия |
6. Оранжеви HTML цветове
Оранжевият работи чудесно, за да подчертае точка, когато цветът, използван като фон и може да предизвика усещане за ентусиазъм и топлина, без да е прекалено лепкав.6. Оранжеви HTML цветове
# C47451 | Портокалова сьомга |
# C36241 | ръжда |
# C35817 | Червена лисица |
# C85A17 | Шоколад |
# CC6600 | Sedona |
# E56717 | Папая портокал |
# E66C2C | Хелоуин портокал |
# F87217 | Тиквен портокал |
# F87431 | Конструкция на конус Orange |
# E67451 | Sunrise Orange |
# FF8040 | Манго портокал |
# F88017 | Тъмно оранжево |
# FF7F50 | корал |
# F88158 | Баскетболна топка за оранжево |
# F9966B | Лека сьомга |
# E78A61 | мандарина |
# E18B6B | Тъмна сьомга |
# E77471 | Лек корал |
# F75D59 | Бобено червено |
# E55451 | Валентин Червен |
# E55B3C | Шокиращ портокал |
7. Червени HTML цветни кодове
За някои браузъри червеният подчертан текст се използва като посетени връзки, трябва да избягвате да го използвате, за да не объркате посетителите.
# FF0000 | червен |
# FF2400 | ален |
# F62217 | Рубинено червен |
# F70D1A | Ferrari Red |
# F62817 | Пожарна машина червено |
# E42217 | Лава Червена |
# E41B17 | Любов червено |
# DC381F | Грейпфрут |
# C34A2C | Кестен червено |
# C24641 | Черешово червено |
# C04000 | махагон |
# C11B17 | Лют пипер |
# 9F000F | Червена боровинка |
# 990012 | Червено вино |
# 8C001A | Бургундия |
# 954535 | кестен |
# 7E3517 | Кърваво червено |
# 8A4117 | сиена |
# 7E3817 | Сангрия |
# 800517 | огнеупорна тухла |
# 810541 | кестеняв |
# 7D0541 | Сливен пай |
# 7E354D | Кадифено Maroon |
# 7D0552 | Plum Velvet |
# 7F4E52 | Рози Финч |
# 7F5A58 | Puce |
# 7F525D | Тъпа лилава |
# B38481 | Рози Браун |
# C5908E | Роза Хаки |
8. Розови HTML цветни кодове
Според цветовата наука, Pink и нейните нюанси могат да бъдат използвани, ако искате посетителят да има чувство на увереност, изтънченост и топлина в подсъзнанието си.
# C48189 | Розов лък |
# C48793 | Червило розово |
# E8ADAA | Rose |
# ECC5C0 | Розово злато |
# EDC9AF | Пустинен пясък |
# FDD7E4 | Свинско розово |
#FCDFFF | Захарен памук |
#FFDFDD | Розова дъвка за балончета |
# FBBBB9 | Misty Rose |
#FAAFBE | розов |
#FAAFBA | Светло розово |
# F9A7B0 | Фламинго розово |
# E7A1B0 | Розова роза |
# E799A3 | Розова маргаритка |
# E38AAE | Cadillac Pink |
# F778A1 | Карамфил розов |
# E56E94 | Руж червен |
# F660AB | Горещо розово |
# FC6C85 | Диня розова |
# F6358A | Виолетово червено |
# F52887 | Дълбоко розово |
# E45E9D | Розов кекс |
# E4287C | Розова лимонада |
# F535AA | Неоново розово |
# FF00FF | пурпурен цвят |
# E3319D | Dimorphotheca Magenta |
# F433FF | Светло неоново розово |
# D16587 | Бледо виолетово червено |
# C25A7C | Лале розово |
# CA226B | Средно виолетово червено |
# C12869 | Rogue Pink |
# C12267 | Изгоряло розово |
# C25283 | Bashful Pink |
# C12283 | Тъмно карамфилово розово |
# B93B8F | слива |
9. Лилави и бели HTML цветни кодове
Използването на цвят на бял текст на бял фон ще го направи нечетлив от потребителите и освен, че не е удобен за потребителя, можете да получите SEO наказание за вашия сайт по този начин, винаги използвайте бяло и други светли цветове срещу тъмен фон.
# 7E587E | Виола Лилаво |
# 571B7E | Лилав ирис |
# 583759 | Plum Purple |
# 4B0082 | индиго |
# 461B7E | Лилаво чудовище |
# 4E387E | Лилава мараня |
# 614051 | Патладжан |
# 5E5A80 | Гроздов |
# 6A287E | Лилаво сладко |
# 7D1B7E | Тъмна орхидея |
# A74AC7 | Лилаво цвете |
# B048B5 | Средна орхидея |
# 6C2DC7 | Лилав аметист |
# 842DCE | Тъмно виолетово |
# 8D38C9 | виолетов |
# 7A5DC7 | Лилав градински чай |
# 7F38EC | Прекрасен лилав |
# 8E35EF | Лилаво |
# 893BFF | Aztech Purple |
# 8467D7 | Средно лилаво |
# A23BEC | Жасмин лилаво |
# B041FF | Лилав нарцис |
# C45AEC | Тириан лилаво |
# 9172EC | Crocus Purple |
# 9E7BFF | Лилава Мимоза |
# D462FF | Хелиотроп лилаво |
# E238EC | пурпурен |
# C38EC7 | Лилав дракон |
# C8A2C8 | люляк |
# E6A9EC | Ружово розово |
# E0B0FF | бледоморав |
# C6AEC7 | Вистерия лилава |
# F9B7FF | Цвят на розово |
# D2B9D3 | магарешки бодил |
# E9CFEC | зимзелен |
# EBDDE2 | Лавандула Пинокио |
# E3E4FA | Лавандулово синьо |
# FDEEF4 | перла |
# FFF5EE | Мида |
#FEFCFF | Мляко бяло |
#FFFFFF | бял |
Някои най-използвани HTML цветни кодове
Това са някои от популярните цветове, използвани в мрежата, аз ги сложих в отделна таблица, така че да се намерят бързо.
червен | # FF0000 | бял | #FFFFFF |
Циан | # 00FFFF | сребърен | # C0C0C0 |
Син | # 0000FF | Сиво или сиво | # 808080 |
Тъмно синьо | # 0000A0 | черно | # 000000 |
Светло синьо | # ADD8E6 | оранжев | # FFA500 |
Лилаво | # 800080 | кафяв | # A52A2A |
жълт | # FFFF00 | кестеняв | # 800000 |
вар | # 00FF00 | зелен | # 008000 |
пурпурен цвят | # FF00FF | маслина | # 808000 |
заключение
Сега, когато имате бързи справочни таблици с общи HTML цветове, трябва да можете да използвате всеки цвят, който искате на страницата си. От креативна гледна точка трябва да избягвате използването на груби цветове, ако можете и когато работите с предния край на сайта, запазването на фоновата графика или цветовете също е важно, за да осигурите подходящ контраст.
Препоръчителни статии
Това е ръководство за HTML имена на цветове. Тук обсъждаме как да прилагаме цветове на уеб страница, използвайки различни HTML цветове с примери. Можете също да прегледате и другите ни предложени статии, за да научите повече -
- Стилове на HTML шрифтове
- HTML атрибути
- Таблици на стилове HTML
- Как работи HTML
- Цветове в Matlab | Как да промените стила в Matlab?