Úvod do barevných názvů HTML

Barevné názvy HTML jsou v odstavci správně označeny. Barvy jsou důležité, nejenže se používají k ozdobení webové stránky, ale v některých případech můžete chtít změnit barvu textu, aby bylo dosaženo lepšího kontrastu na pozadí stránky. Vzhledem k tomu, že HTML je psáno v textové podobě, nemůžete pouze zabarvit kód podle svých představ a očekávat, že webový prohlížeč při vykreslování stránky použije stejnou barvu. Místo toho se budete muset uchýlit k používání značek a atributů a sdělit prohlížeči, jakou barvu použít.

Barvy v HTML

V názvech barev HTML lze barvy označit pomocí jejich hexadecimální hodnoty nebo názvu. HTML má podporu pro většinu běžných barev, v tomto článku se s vámi podělím o 140 jmen a hex hodnot těchto barev.

Jedna věc, kterou je třeba mít na paměti, je, že se nemusíte omezovat na tyto barvy, můžete použít jakýkoli nástroj pro výběr barvy k nalezení hexadecimální hodnoty jakékoli barvy, kterou chcete, a použít ji na své webové stránce.

Používání barevných názvů HTML

Implementace barev na vaší webové stránce je snadná a lze ji provést inline i prostřednictvím samostatné šablony stylů CSS.

Pokud na stránce budete opakovaně používat stejná barevná jména HTML, je lepší definovat a nastavit barvy pomocí listu CSS. Naopak, pokud potřebujete použít barvu pouze jednou nebo dvakrát, je lepší použít metodu inline.

1. Použití 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

2. Implementace v CSS

h1 ( color: Brown; )
p ( color: Gainsboro; )

Různé barevné názvy HTML

Nyní, když víte, jaké jsou barevné názvy HTML a jak je můžete použít na svých stránkách, zde je odkaz názvů barev, které můžete ve svých projektech uložit do záložek a použít:

1. Šedé a černé barevné názvy HTML

Šedé a černé barvy jsou ve většině případů perfektní pro barvu textu stránky oproti bílému pozadí. Tyto barvy mají nejlepší čitelnost. Jednou zajímavou věcí, kterou je třeba mít na paměti, je, že moderní telefony s OLED displejem potřebují jakoukoli baterii, aby zobrazovaly černou barvu, pokud bude vaše publikum na mobilu, je moudré používat černou jako barvu pozadí a bílé nebo jiné světlo barvy jako barva popředí.

KódBarva
# 000000Černá
# 0C090ANoc
# 2C3539Gunmetal
# 2B1B17Půlnoc
# 34282CDřevěné uhlí
# 25383CDark Slate Grey
# 3B3131Olej
# 413839Černá kočka
# 3D3C3AIridium
# 463E3FČerný úhoř
# 4C4646Černá kráva
# 504A4BŠedý vlk
# 565051Upír Gray
# 5C5858Šedý delfín
# 625D5DUhlíková šedá
# 666362Ash Gray
# 6D6968Zataženo šedá
# 726E6DSmokey Gray
# 736F6EŠedá
# 837E7CŽula
# 848482Bitevní loď Grey
# B6B6B4Šedý mrak
# D1D0CEGrey Goose
# E5E4E2Platina
# BCC6CCKovové stříbro
# 98AFC7Modrá Šedá
# 6D7B8DSvětle břidlicová šedá
# 657383Břidlicová šedá
# 616D7EJet Gray

2. Modré názvy barev HTML

Modrý podtržený text je považován za odkaz, protože se jedná o výchozí styl odkazu pro většinu webových prohlížečů, měli byste se vyhnout použití modrého pro veškerý text na stránce, protože jej mohou návštěvníci zaměnit za hypertextové odkazy.

# 646D7EMlha Modrá
# 566D7EMramorová modrá
# 737CA1Břidlicová modrá
# 4863A0Ocelová modrá
# 2B547EBlue Jay
# 2B3856Dark Slate Blue
# 151B54Půlnoční modrá
# 000080Námořnická modrá
# 342D7EModrá velryba
# 15317ELapis Blue
# 151B8DDžínovina tmavě modrá
# 0000A0Země modrá
# 0020C2Kobaltová modř
# 0041C2Blueberry Blue
# 2554C7Safírově modrá
# 1569C7Modré oči
# 2B60DEKrálovská modrá
# 1F45FCModrá orchidej
# 6960ECBlue Lotus
# 736AFFSvětle břidlicová modrá
# 357EC7Windows Blue
# 368BC1Ledový modrý led
# 488AC7Hedvábná modrá
# 3090C7Modrý břečťan
# 659EC7Blue Koi
# 87AFC7Columbia Blue
# 95B9C7Baby Blue
# 728FCESvětle ocelová modrá
# 2B65ECOcean Blue
# 306EFFModrá stužka
# 157DECModré šaty
# 1589FFDodger Blue
# 6495EDChrpa modrá
# 6698FFModrá obloha
# 38ACECMotýl modrý
# 56A5ECLedovec
# 5CB3FFKřišťálově modrá
# 3BB9FFDeep Sky Blue
# 79BAECDenim Blue
# 82CAFASvětle modrá obloha
# 82CAFFDenní Sky Blue
# A0CFECDžíny modré
# B7CEECModrý anděl
# B4CFECPastelově modrá
# C2DFFFMořská modrá
# C6DEFFModrý prášek
#AFDCECCoral Blue
#ADDFFFSvětle modrá
#BDEDFFRobin Egg Blue
#CFECECBledě modrá lilie
# E0FFFFLehká azurová
# EBF4FAVoda
# F0F8FFAliceBlue
# F0FFFFBlankyt
#CCFFFFLehká břidlice
# 93FFE8Lehký akvamarín
# 9AFEFFElektrická modrá
# 7FFFD4Akvamarín
# 00FFFFAzurová nebo Aqua
# 7DFDFETron Blue
# 57FEFFModrý zirkon
# 8EEBECModrá laguna
# 50EBECCeleste
# 4EE2ECModrý diamant
# 81D8D0Tiffany Blue
# 92C7C7Azurová neprůhledná
# 77BFC7Modrá Hosta
# 78C7C7Polární záře modrá
# 48CCCDStřední tyrkysová
# 43C6DBTyrkysový
# 46C7C7Medúza
# 7BCCB5Modrá zelená

3. Zelené barvy HTML

Na webech souvisejících s přírodou, penězi, životním prostředím atd. Může být zelená dobrá volba barvy, kterou lze použít jako pozadí.

# 43BFC7Papoušek modrá zelená
# 3EA99FSvětle mořská zelená
# 3B9C9CTmavě tyrkysová
# 438D80Mořská želva zelená
# 348781Střední akvamarín
# 307D7EZelenkavě modrá
# 5E7D7EŠedá tyrkysová
# 4C787EBrouk zelený
# 008080Šedozelená
# 4E8975Zelené moře
# 78866BKamufláž Zelená
# 848b79Šedozelená barva
# 617C58Hazel Green
# 728C00Venom Green
# 667C26Fern Green
# 254117Dark Forest Green
# 306754Středně mořská zelená
# 347235Střední lesní zelená
# 437C17Mořské řasy zelené
# 387C44Borovice zelená
# 347C2CJungle Green
# 347C17Shamrock Green
# 348017Střední jarní zelená
# 4E9258Lesní zelená
# 6AA121Zelená cibule
# 4AA02CJarní zelená
# 41A317Limetkově zelená
# 3EA055Jetel zelený
# 6CBB3CZelený had
# 6CC417Alien Green
# 4CC417Zelené jablko
# 52D017Žluto zelená
# 4CC552Kelly Green
# 54C571Zombie Green
# 99C68EŽába zelená
# 89C35CZelený hrášek
# 85BB65Dolar Bill Green
# 8BB381Dark Sea Green
# 9CB071Leguán zelený
# B2C248Avokádo Zelená
# 9DC209Pistáciová zelená
# A1C935Salát zelený
# 7FE817Kolibřík zelený
# 59E817Mlhovina zelená
# 57E964Svítí zeleně
# 64E986Zelené řasy
# 5EFB6EJade Green
# 00FF00Zelený
# 5FFB17Smaragdová zeleň
# 87F717Trávník zelený
# 8AFB17Chartreuse
# 6AFB92Dragon Green
# 98FF98mátově zelená
# B5EAAAZelený palec
# C3FDB8Světlo Jade
# CCFB5DZelený čaj
# B1FB17Zelená žlutá
# BCE954Slizově zelená
# EDDA74Goldenrod
# EDE275Sklizeň zlata
# FFE87CSun Yellow

4. Žlutá HTML barevná jména

Žlutou lze použít k nastavení nezávažné nálady, ukázat kreativitu a optimismus na stránce. Mějte na paměti, že žlutá funguje lépe jako pozadí a barva textu.

# FFFF00Žlutá
# FFF380Kukuřice žlutá
# FFFFC2Pergamen
#FFFFCCKrém
# FFF8C6Citron šifon
# FFF8DCCornsilk
# F5F5DCBéžový
# FBF6D9Blondýnka
# FAEBD7AntiqueWhite
# F7E7CEŠampaňské
#FFEBCDBlanchedAlmond
# F3E5ABVanilka
# ECE5B6Tan Brown
# FFE5B4Broskev
# FFDB58Hořčice
# FFD801Rubber Ducky Yellow
# FDD017Světlé zlato
# EAC117zlatavě hnědá
# F2BB66Makaróny a sýr
# FBB917Šafrán
# FBB117Pivo
# FFA62FAnanasový meloun
# E9AB17Bee Yellow

5. Hnědé barvy HTML

Hnědé pozadí může ztížit čtení bílého nebo černého textu, můžete se uchýlit k uživatelům jiných barev, které mají dobrý kontrast proti vašemu odstínu hnědé.

# E2A76FHnědý cukr
# DEB887BurlyWood
# FFCBA4Deep Peach
# C9BE62Ginger Brown
# E8A317Školní autobus žlutá
# EE9A4DSandy Brown
# C8B560Fall Leaf Brown
# D4A017Oranžové zlato
# C2B280Písek
# C7A317Cookie Brown
# C68E17Karamel
# B5A642Mosaz
# ADA96EKhaki
# C19A6BVelbloudí hnědá
# CD7F32Bronz
# C88141Tiger Orange
# C58917Skořice
# AF9B60Bullet Shell
# AF7817Dark Goldenrod
# B87333Měď
# 966F33Dřevo
# 806517Oak Brown
# 827839Mokasín
# 827B60Army Brown
# 786D5FPískovec
# 493D26Moka
# 483C32Taupe
# 6F4E37Káva
# 835C3BMedvěd hnědý
# 7F5217Červená špína
# 7F462CSépie

6. Oranžové barvy HTML

Orange pracuje skvěle na zvýraznění bodu, kdy se barva používá jako pozadí, a může vyvolat pocit nadšení a tepla, aniž by byl příliš lepkavý.6. Oranžové barvy HTML

# C47451Oranžový losos
# C36241Rez
# C35817Červená Liška
# C85A17Čokoláda
# CC6600Sedona
# E56717Papája oranžová
# E66C2CHalloween Orange
# F87217Dýňová oranžová
# F87431Stavební kužel Orange
# E67451Sunrise Orange
# FF8040Mango oranžová
# F88017Tmavě oranžová
# FF7F50Korál
# F88158Basket Ball Orange
# F9966BLehký losos
# E78A61Mandarinka
# E18B6BTmavý losos
# E77471Lehký Coral
# F75D59Bean Red
# E55451Valentine červená
# E55B3CŠokující Orange

7. Červené barevné kódy HTML

U některých prohlížečů je červeně podtržený text používán jako navštívené odkazy, neměli byste jej používat k tomu, aby nezaváděli návštěvníky.

# FF0000Červené
# FF2400Scarlet
# F62217Rubínově červený
# F70D1AFerrari Red
# F62817Fire Engine Red
# E42217Láva červená
# E41B17Láska červená
# DC381FGrapefruit
# C34A2CKaštanová červená
# C24641Třešňově červený
# C04000Mahagon
# C11B17Čili paprička
# 9F000FBrusinka
# 990012Červené víno
# 8C001Aburgundské
# 954535Kaštan
# 7E3517Krvavě rudý
# 8A4117Sienna
# 7E3817Sangria
# 800517Firebrick
# 810541Maroon
# 7D0541Švestkový koláč
# 7E354DVelvet Maroon
# 7D0552Švestka Velvet
# 7F4E52Rosy Finch
# 7F5A58Puce
# 7F525DDull Purple
# B38481Rosy Brown
# C5908EKhaki Rose

8. Růžové barevné kódy HTML

Podle vědy o barvě, Pink a jeho odstíny mohou být použity, pokud chcete, aby návštěvník měl pocit sebevědomí, sofistikovanosti a vřelosti v jejich podvědomí.

# C48189Růžový luk
# C48793Rtěnka růžová
# E8ADAARůže
# ECC5C0Rose Gold
# EDC9AFPouštní písek
# FDD7E4Prase růžová
#FCDFFFCukrová vata
#FFDFDDPink Bubble Gum
# FBBBB9Misty Rose
#FAAFBERůžový
#FAAFBASvětle růžová
# F9A7B0Plameňák růžový
# E7A1B0Růžová růže
# E799A3Pink Daisy
# E38AAECadillac Pink
# F778A1Karafiát růžový
# E56E94Červenat červená
# F660ABHot Pink
# FC6C85Meloun růžový
# F6358AFialová červená
# F52887Sytě růžová
# E45E9DRůžový košíček
# E4287CRůžová limonáda
# F535AANeon Pink
# FF00FFPurpurová
# E3319DDimorphotheca Magenta
# F433FFBright Neon Pink
# D16587Světle fialová červená
# C25A7CTulipánová růžová
# CA226BStřední fialová červená
# C12869Rogue Pink
# C12267Spálená růžová
# C25283Bashful Pink
# C12283Dark Carnation Pink
# B93B8FŠvestka

9. Fialové a bílé barevné kódy HTML

Používání barvy bílého textu proti Bílému pozadí způsobí, že uživatelé nebudou číst, a kromě toho, že nebudou uživatelsky přívětiví, můžete pro svůj web získat pokutu SEO, proto vždy používejte bílé a jiné světlé barvy proti tmavému pozadí.

# 7E587EViola Purple
# 571B7EPurple Iris
# 583759Plum Purple
# 4B0082Indigo
# 461B7EPurple Monster
# 4E387EFialová mlha
# 614051Lilek
# 5E5A80Hroznový
# 6A287EPurple Jam
# 7D1B7EDark Orchid
# A74AC7Fialový květ
# B048B5Střední orchidej
# 6C2DC7Fialový ametyst
# 842DCEDark Violet
# 8D38C9fialový
# 7A5DC7Purple Sage Bush
# 7F38ECKrásné fialové
# 8E35EFNachový
# 893 BFFAztech Purple
# 8467D7Střední fialová
# A23BECJasmine Purple
# B041FFFialový narcis
# C45AECTyrian Purple
# 9172ECCrocus Purple
# 9E7BFFPurpurová Mimosa
# D462FFHeliotrope Purple
# E238ECKarmínový
# C38EC7Fialový drak
# C8A2C8Šeřík
# E6A9ECČervenavě růžová
# E0B0FFNafialovělý
# C6AEC7Wisteria Purple
# F9B7FFBlossom Pink
# D2B9D3Bodlák
# E9CFECBrčál
# EBDDE2Levandule Pinocchio
# E3E4FALevandule modrá
# FDEEF4Perla
# FFF5EEMušle
#FEFCFFMléčná bílá
#FFFFFFBílý

Některé nejpoužívanější barevné kódy HTML

To jsou některé z populárních barev používaných na webu, dal jsem je do samostatné tabulky, aby je bylo možné rychle najít.

Červené# FF0000Bílý#FFFFFF
Tyrkysová# 00FFFFstříbrný# C0C0C0
Modrý# 0000FFŠedá nebo šedá# 808080
Tmavě modrá# 0000A0Černá# 000000
Světle modrá# ADD8E6oranžový# FFA500
Nachový# 800080Hnědý# A52A2A
Žlutá# FFFF00Maroon# 800000
Limetka# 00FF00Zelený# 008000
Purpurová# FF00FFOlivový# 808000

Závěr

Nyní, když máte rychlé referenční tabulky běžných barev HTML, byste na své stránce měli mít možnost použít libovolnou barvu. Z kreativního hlediska byste se měli vyhnout použití tvrdých barev, pokud je to možné, a při práci s frontendem webu je také důležité udržovat grafiku pozadí nebo barvy, aby byl zajištěn správný kontrast.

Doporučené články

Toto je průvodce barevnými názvy HTML. Zde diskutujeme o tom, jak implementovat barvy na webové stránce pomocí různých barev HTML. Další informace naleznete také v dalších navrhovaných článcích -

  1. Styly písem HTML
  2. Atributy HTML
  3. HTML styly
  4. Jak funguje HTML
  5. Barvy v Matlabu | Jak změnit styl v Matlabu?