Introduzione ai nomi dei colori HTML
I nomi dei colori HTML sono correttamente indicati nel par. I colori sono importanti, non solo sono usati per decorare una pagina web, ma in alcuni casi, potresti voler cambiare il colore del testo per fornire un migliore contrasto con lo sfondo della pagina. Considerando che l'HTML è scritto in forma di testo, non puoi semplicemente colorare il codice a tuo piacimento e aspettarti che il browser web usi lo stesso colore durante il rendering della pagina. Invece, dovrai ricorrere all'uso di tag e attributi per dire al browser quale colore usare.
Colori in HTML
Nei nomi dei colori HTML, i colori possono essere indicati usando il loro valore esadecimale o il suo nome. HTML ha il supporto per i colori più comuni, in questo articolo condividerò con te 140 nomi e valori esadecimali di questi colori.
Una cosa da tenere a mente è che non devi limitarti a questi colori, puoi utilizzare qualsiasi strumento di selezione dei colori per trovare il valore esadecimale di qualsiasi colore desiderato e utilizzarlo sulla tua pagina web.
Utilizzo dei nomi dei colori HTML
L'implementazione dei colori sulla tua pagina web è semplice e può essere eseguita sia in linea che tramite un foglio di stile CSS separato.
Quando si utilizzano più volte gli stessi nomi di colori HTML su una pagina, è consigliabile utilizzare il foglio CSS per definire e impostare i colori. Al contrario, se devi usare il colore solo una o due volte, l'uso del metodo in linea è considerato migliore.
1. Utilizzo di 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. Implementazione in CSS
h1 ( color: Brown; )
p ( color: Gainsboro; )
Nomi di colori HTML diversi
Ora che sai cosa sono i nomi dei colori HTML e come puoi usarli nelle tue pagine, ecco un link di nomi dei colori che puoi aggiungere ai segnalibri e usare nei tuoi progetti:
1. Nomi di colore HTML grigio e nero
I colori grigio e nero sono, nella maggior parte dei casi perfetti per il colore del testo della pagina, poiché su uno sfondo bianco questi colori hanno la migliore leggibilità. Una cosa interessante da tenere a mente è che i telefoni moderni con display OLED hanno bisogno di qualsiasi carica della batteria per visualizzare il colore nero se il tuo pubblico sarà mobile, è una saggia idea usare il nero come colore di sfondo e il bianco o altra luce colori come colore di primo piano.
Codice | Colore |
# 000000 | Nero |
# 0C090A | Notte |
# 2C3539 | Gunmetal |
# 2B1B17 | Mezzanotte |
# 34282C | Carbone |
# 25383C | Grigio ardesia scuro |
# 3B3131 | Olio |
# 413839 | Gatto nero |
# 3D3C3A | Iridio |
# 463E3F | Anguilla Nera |
# 4C4646 | Mucca nera |
# 504A4B | Lupo grigio |
# 565051 | Vampire Grey |
# 5C5858 | Delfino grigio |
# 625D5D | Carbon Grey |
# 666.362 | Ash Grey |
# 6D6968 | Nuvoloso Grigio |
# 726E6D | Smokey Grey |
# 736F6E | Grigio |
# 837E7C | Granito |
# 848.482 | Battleship Grey |
# B6B6B4 | Grey Cloud |
# D1D0CE | Grey Goose |
# E5E4E2 | Platino |
# BCC6CC | Argento metallico |
# 98AFC7 | Blu grigio |
# 6D7B8D | Grigio ardesia chiaro |
# 657.383 | Grigio ardesia |
# 616D7E | Jet Grey |
2. Nomi di colore HTML blu
Il testo sottolineato in blu è considerato un collegamento in quanto è lo stile di collegamento predefinito per la maggior parte dei browser Web, dovresti evitare di utilizzare il blu per tutto il testo in una pagina poiché i visitatori possono scambiarlo per collegamenti ipertestuali.
# 646D7E | Mist Blue |
# 566D7E | Marmo Blu |
# 737CA1 | Blu ardesia |
# 4863A0 | Blu acciaio |
# 2B547E | Blue Jay |
# 2B3856 | Blu ardesia scuro |
# 151B54 | Blu notte |
# 000080 | Blu navy |
# 342D7E | Balena Blu |
# 15317E | Blu Lapis |
# 151B8D | Denim Blu scuro |
# 0000A0 | Blu terra |
# 0020C2 | Blu cobalto |
# 0041C2 | Blueberry Blue |
# 2554C7 | Blu zaffiro |
# 1569C7 | Occhi blu |
# 2B60DE | Blu Reale |
# 1F45FC | Orchidea blu |
# 6960EC | Loto blu |
# 736AFF | Blu ardesia chiaro |
# 357EC7 | Windows Blue |
# 368BC1 | Ghiaccio blu glaciale |
# 488AC7 | Silk Blue |
# 3090C7 | Edera blu |
# 659EC7 | Blue Koi |
# 87AFC7 | Columbia Blue |
# 95B9C7 | Bambina blu |
# 728FCE | Blu acciaio chiaro |
# 2B65EC | Oceano blu |
# 306EFF | Nastro blu |
# 157DEC | Vestito blu |
# 1589FF | Dodger Blue |
# 6495ED | Blu Fiordaliso |
# 6698FF | Cielo blu |
# 38ACEC | Butterfly Blue |
# 56A5EC | Iceberg |
# 5CB3FF | Crystal Blue |
# 3BB9FF | Deep Sky Blue |
# 79BAEC | Denim Blue |
# 82CAFA | Azzurro cielo |
# 82CAFF | Day Sky Blue |
# A0CFEC | Jeans blu |
# B7CEEC | Angelo blu |
# B4CFEC | Blu pastello |
# C2DFFF | Mare blu |
# C6DEFF | Blu polvere |
#AFDCEC | Coral Blue |
#ADDFFF | Azzurro |
#BDEDFF | Robin Egg Blue |
#CFECEC | Giglio blu pallido |
# E0FFFF | Ciano chiaro |
# EBF4FA | acqua |
# F0F8FF | AliceBlue |
# F0FFFF | Azzurro |
#CCFFFF | Ardesia chiara |
# 93FFE8 | Acquamarina chiara |
# 9AFEFF | Blu elettrico |
# 7FFFD4 | Acquamarina |
# 00FFFF | Ciano o Aqua |
# 7DFDFE | Tron Blue |
# 57FEFF | Zircone Blu |
# 8EEBEC | Laguna Blu |
# 50EBEC | Celeste |
# 4EE2EC | Diamante blu |
# 81D8D0 | Tiffany Blue |
# 92C7C7 | Ciano opaco |
# 77BFC7 | Hosta blu |
# 78C7C7 | Aurora boreale blu |
# 48CCCD | Turchese medio |
# 43C6DB | Turchese |
# 46C7C7 | Medusa |
# 7BCCB5 | Blu verde |
3. Colori HTML verdi
Sui siti relativi a natura, denaro, ambiente, ecc., Il verde può essere una buona scelta di colore da utilizzare come sfondo.
# 43BFC7 | Ara Blu Verde |
# 3EA99F | Light Sea Green |
# 3B9C9C | Turchese scuro |
# 438D80 | Tartaruga Verde |
# 348.781 | Acquamarina media |
# 307D7E | Blu verdastro |
# 5E7D7E | Turchese grigiastro |
# 4C787E | Beetle Green |
# 008.080 | Teal |
# 4E8975 | Mare verde |
# 78866B | Verde mimetico |
# 848b79 | Verde salvia |
# 617C58 | Verde nocciola |
# 728C00 | Venom Green |
# 667C26 | Fern Green |
# 254117 | Dark Forest Green |
# 306754 | Verde Mare Medio |
# 347.235 | Verde medio foresta |
# 437C17 | Alghe Verdi |
# 387C44 | Verde pino |
# 347C2C | Jungle Green |
# 347C17 | Shamrock Green |
# 348.017 | Verde medio primaverile |
# 4E9258 | Verde foresta |
# 6AA121 | Cipolla verde |
# 4AA02C | Verde primavera |
# 41A317 | Verde lime |
# 3EA055 | Clover Green |
# 6CBB3C | Serpente Verde |
# 6CC417 | Alien Green |
# 4CC417 | Mela verde |
# 52D017 | Giallo verde |
# 4CC552 | Kelly Green |
# 54C571 | Zombie Green |
# 99C68E | Frog Green |
# 89C35C | Piselli verdi |
# 85BB65 | Dollar Bill Green |
# 8BB381 | Dark Sea Green |
# 9CB071 | Iguana Green |
# B2C248 | Verde avocado |
# 9DC209 | Verde Pistacchio |
# A1C935 | Insalata verde |
# 7FE817 | Hummingbird Green |
# 59E817 | Nebulosa Verde |
# 57E964 | Semaforo Diventa Verde |
# 64E986 | Alghe Verdi |
# 5EFB6E | Verde giada |
# 00FF00 | verde |
# 5FFB17 | Verde smeraldo |
# 87F717 | Verde prato |
# 8AFB17 | certosa |
# 6AFB92 | Dragon Green |
# 98FF98 | menta verde |
# B5EAAA | Pollice verde |
# C3FDB8 | Light Jade |
# CCFB5D | Tè verde |
# B1FB17 | Verde giallo |
# BCE954 | Melma Verde |
# EDDA74 | Verga d'oro |
# EDE275 | Harvest Gold |
# FFE87C | Sun Yellow |
4. Nomi di colore HTML gialli
Il giallo può essere utilizzato per creare uno stato d'animo non serio, mostrare creatività e ottimismo in una pagina. Tieni presente che il giallo funziona meglio come sfondo di un colore del testo.
# FFFF00 | Giallo |
# FFF380 | Giallo mais |
# FFFFC2 | Pergamena |
#FFFFCC | Crema |
# FFF8C6 | Chiffon al limone |
# FFF8DC | Cornsilk |
# F5F5DC | Beige |
# FBF6D9 | bionda |
# FAEBD7 | AntiqueWhite |
# F7E7CE | Champagne |
#FFEBCD | BlanchedAlmond |
# F3E5AB | Vaniglia |
# ECE5B6 | Marrone Chiaro |
# FFE5B4 | pesca |
# FFDB58 | Mostarda |
# FFD801 | Rubber Ducky Yellow |
# FDD017 | Oro brillante |
# EAC117 | Marrone dorato |
# F2BB66 | Maccheroni e formaggio |
# FBB917 | Zafferano |
# FBB117 | birra |
# FFA62F | Cantalupo |
# E9AB17 | Ape giallo |
5. Colori HTML marroni
Lo sfondo marrone può rendere difficile leggere il testo bianco o nero, puoi ricorrere all'utente altri colori che hanno un buon contrasto con la tua tonalità di marrone.
# E2A76F | Zucchero di canna |
# DEB887 | burlywood |
# FFCBA4 | Pesca profonda |
# C9BE62 | Ginger Brown |
# E8A317 | Scuolabus Giallo |
# EE9A4D | Sandy Brown |
# C8B560 | Foglia d'autunno marrone |
# D4A017 | Orange Gold |
# C2B280 | Sabbia |
# C7A317 | Biscotto Marrone |
# C68E17 | Caramello |
# B5A642 | Ottone |
# ADA96E | Cachi |
# C19A6B | Marrone cammello |
# CD7F32 | Bronzo |
# C88141 | Tiger Orange |
# C58917 | Cannella |
# AF9B60 | Bullet Shell |
# AF7817 | Verga d'oro scuro |
# B87333 | Rame |
# 966F33 | Legna |
# 806.517 | Rovere Marrone |
# 827.839 | Mocassino |
# 827B60 | Army Brown |
# 786D5F | Arenaria |
# 493D26 | moca |
# 483C32 | taupe |
# 6F4E37 | caffè |
# 835C3B | Orso bruno |
# 7F5217 | Sporcizia rossa |
# 7F462C | nero di seppia |
6. Colori HTML arancioni
L'arancione funziona benissimo per evidenziare un momento in cui il colore viene utilizzato come sfondo e può evocare sensazione di entusiasmo e calore senza essere troppo appiccicoso.6. Colori HTML arancioni
# C47451 | Salmone all'arancia |
# C36241 | Ruggine |
# C35817 | Volpe rossa |
# C85A17 | Cioccolato |
# CC6600 | Sedona |
# E56717 | Papaya Orange |
# E66C2C | Halloween Orange |
# F87217 | Zucca Di Arancia |
# F87431 | Cono di costruzione arancione |
# E67451 | Sunrise Orange |
# FF8040 | Mango Orange |
# F88017 | Arancione scuro |
# FF7F50 | Corallo |
# F88158 | Basket Ball Orange |
# F9966B | Salmone Leggero |
# E78A61 | Mandarino |
# E18B6B | Salmone Scuro |
# E77471 | Corallo chiaro |
# F75D59 | Bean Red |
# E55451 | Valentine Red |
# E55B3C | Arancia scioccante |
7. Codici colore HTML rossi
Per alcuni browser, il testo sottolineato rosso è usato come link visitato, dovresti evitare di usarlo per non confondere i visitatori.
# FF0000 | Rosso |
# FF2400 | Scarlatto |
# F62217 | Rosso rubino |
# F70D1A | Ferrari Red |
# F62817 | Autopompa antincendio rossa |
# E42217 | Lava Red |
# E41B17 | Love Red |
# DC381F | Pompelmo |
# C34A2C | Castano Rosso |
# C24641 | Rosso ciliegia |
# C04000 | Mogano |
# C11B17 | Peperoncino |
# 9F000F | Mirtillo |
# 990.012 | Vino rosso |
# 8C001A | Borgogna |
# 954.535 | Castagna |
# 7E3517 | Sangue rosso |
# 8A4117 | terra di siena |
# 7E3817 | Sangria |
# 800.517 | Firebrick |
# 810.541 | Marrone |
# 7D0541 | Plum Pie |
# 7E354D | Velvet Maroon |
# 7D0552 | Plum Velvet |
# 7F4E52 | Rosy Finch |
# 7F5A58 | color pulce |
# 7F525D | Viola opaco |
# B38481 | Rosy Brown |
# C5908E | Khaki Rose |
8. Codici colore HTML rosa
Secondo la scienza del colore, il rosa e le sue sfumature possono essere utilizzate se si desidera che il visitatore abbia una sensazione di fiducia, raffinatezza e calore nel proprio subconscio.
# C48189 | Arco rosa |
# C48793 | Rossetto Rosa |
# E8ADAA | Rosa |
# ECC5C0 | Oro rosa |
# EDC9AF | Sabbia del deserto |
# FDD7E4 | Rosa Maiale |
#FCDFFF | Zucchero filato |
#FFDFDD | Gomma da masticare rosa |
# FBBBB9 | Misty Rose |
#FAAFBE | Rosa |
#FAAFBA | Rosa chiaro |
# F9A7B0 | Flamingo Pink |
# E7A1B0 | Rosa Rosa |
# E799A3 | Pink Daisy |
# E38AAE | Cadillac Pink |
# F778A1 | Garofano Rosa |
# E56E94 | Blush Red |
# F660AB | Rosa caldo |
# FC6C85 | Anguria Rosa |
# F6358A | Rosso viola |
# F52887 | Rosa scuro |
# E45E9D | Cupcake Rosa |
# E4287C | Limonata rosa |
# F535AA | Rosa fluo |
# FF00FF | Magenta |
# E3319D | Dimorphotheca Magenta |
# F433FF | Neon rosa brillante |
# D16587 | Pale Violet Red |
# C25A7C | Tulip Pink |
# CA226B | Rosso violaceo medio |
# C12869 | Rogue Pink |
# C12267 | Rosa bruciato |
# C25283 | Rosa vergognoso |
# C12283 | Garofano scuro rosa |
# B93B8F | prugna |
9. Codici colore HTML viola e bianco
L'uso del colore del testo bianco su sfondo bianco lo renderà illeggibile dagli utenti e oltre a non essere user friendly, potresti ottenere una penalità SEO per il tuo sito, quindi usa sempre colori bianchi e altri colori chiari su sfondi scuri.
# 7E587E | Viola Viola |
# 571B7E | Iris viola |
# 583.759 | Prugna Viola |
# 4B0082 | Indaco |
# 461B7E | Mostro Viola |
# 4E387E | Purple Haze |
# 614.051 | Melanzana |
# 5E5A80 | Uva |
# 6A287E | Marmellata Viola |
# 7D1B7E | Orchidea scura |
# A74AC7 | Fiore viola |
# B048B5 | Orchidea Media |
# 6C2DC7 | Ametista Viola |
# 842DCE | Viola scuro |
# 8D38C9 | Viola |
# 7A5DC7 | Bush salvia viola |
# 7F38EC | Lovely Purple |
# 8E35EF | Viola |
# 893BFF | Aztech Purple |
# 8467D7 | Viola medio |
# A23BEC | Jasmine Purple |
# B041FF | Narciso viola |
# C45AEC | Tyrian Purple |
# 9172EC | Crocus Purple |
# 9E7BFF | Mimosa viola |
# D462FF | Eliotropio Viola |
# E238EC | Cremisi |
# C38EC7 | Drago Viola |
# C8A2C8 | Lilla |
# E6A9EC | Blush Pink |
# E0B0FF | Malva |
# C6AEC7 | Glicine Viola |
# F9B7FF | Blossom Pink |
# D2B9D3 | Cardo |
# E9CFEC | Pervinca |
# EBDDE2 | Pinocchio alla lavanda |
# E3E4FA | Blu lavanda |
# FDEEF4 | Perla |
# FFF5EE | Conchiglia |
#FEFCFF | Bianco latte |
#FFFFFF | bianca |
Alcuni codici colore HTML più utilizzati
Questi sono alcuni dei colori popolari utilizzati sul web, li ho messi in una tabella separata in modo che questi possano essere trovati rapidamente.
Rosso | # FF0000 | bianca | #FFFFFF |
Ciano | # 00FFFF | Argento | # C0C0C0 |
Blu | # 0000FF | Grigio o grigio | # 808080 |
Blu scuro | # 0000A0 | Nero | # 000000 |
Azzurro | # ADD8E6 | arancia | # FFA500 |
Viola | # 800080 | Marrone | # A52A2A |
Giallo | # FFFF00 | Marrone | # 800000 |
Lime | # 00FF00 | verde | # 008000 |
Magenta | # FF00FF | Oliva | # 808.000 |
Conclusione
Ora che disponi di tabelle di riferimento rapido di colori HTML comuni, dovresti essere in grado di utilizzare qualsiasi colore desiderato sulla tua pagina. Dal punto di vista creativo, dovresti evitare l'uso di colori aggressivi se puoi e quando lavori con il front-end del sito, anche mantenere la grafica o i colori di sfondo è importante per garantire un contrasto adeguato.
Articoli consigliati
Questa è una guida ai nomi dei colori HTML. Qui discutiamo come implementare i colori su una pagina web usando diversi colori HTML con esempi. Puoi anche consultare i nostri altri articoli suggeriti per saperne di più–
- Stili di font HTML
- Attributi HTML
- Fogli di stile HTML
- Come funziona HTML
- Colori in Matlab | Come cambiare lo stile in Matlab?