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

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.

CodiceColore
# 000000Nero
# 0C090ANotte
# 2C3539Gunmetal
# 2B1B17Mezzanotte
# 34282CCarbone
# 25383CGrigio ardesia scuro
# 3B3131Olio
# 413839Gatto nero
# 3D3C3AIridio
# 463E3FAnguilla Nera
# 4C4646Mucca nera
# 504A4BLupo grigio
# 565051Vampire Grey
# 5C5858Delfino grigio
# 625D5DCarbon Grey
# 666.362Ash Grey
# 6D6968Nuvoloso Grigio
# 726E6DSmokey Grey
# 736F6EGrigio
# 837E7CGranito
# 848.482Battleship Grey
# B6B6B4Grey Cloud
# D1D0CEGrey Goose
# E5E4E2Platino
# BCC6CCArgento metallico
# 98AFC7Blu grigio
# 6D7B8DGrigio ardesia chiaro
# 657.383Grigio ardesia
# 616D7EJet 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.

# 646D7EMist Blue
# 566D7EMarmo Blu
# 737CA1Blu ardesia
# 4863A0Blu acciaio
# 2B547EBlue Jay
# 2B3856Blu ardesia scuro
# 151B54Blu notte
# 000080Blu navy
# 342D7EBalena Blu
# 15317EBlu Lapis
# 151B8DDenim Blu scuro
# 0000A0Blu terra
# 0020C2Blu cobalto
# 0041C2Blueberry Blue
# 2554C7Blu zaffiro
# 1569C7Occhi blu
# 2B60DEBlu Reale
# 1F45FCOrchidea blu
# 6960ECLoto blu
# 736AFFBlu ardesia chiaro
# 357EC7Windows Blue
# 368BC1Ghiaccio blu glaciale
# 488AC7Silk Blue
# 3090C7Edera blu
# 659EC7Blue Koi
# 87AFC7Columbia Blue
# 95B9C7Bambina blu
# 728FCEBlu acciaio chiaro
# 2B65ECOceano blu
# 306EFFNastro blu
# 157DECVestito blu
# 1589FFDodger Blue
# 6495EDBlu Fiordaliso
# 6698FFCielo blu
# 38ACECButterfly Blue
# 56A5ECIceberg
# 5CB3FFCrystal Blue
# 3BB9FFDeep Sky Blue
# 79BAECDenim Blue
# 82CAFAAzzurro cielo
# 82CAFFDay Sky Blue
# A0CFECJeans blu
# B7CEECAngelo blu
# B4CFECBlu pastello
# C2DFFFMare blu
# C6DEFFBlu polvere
#AFDCECCoral Blue
#ADDFFFAzzurro
#BDEDFFRobin Egg Blue
#CFECECGiglio blu pallido
# E0FFFFCiano chiaro
# EBF4FAacqua
# F0F8FFAliceBlue
# F0FFFFAzzurro
#CCFFFFArdesia chiara
# 93FFE8Acquamarina chiara
# 9AFEFFBlu elettrico
# 7FFFD4Acquamarina
# 00FFFFCiano o Aqua
# 7DFDFETron Blue
# 57FEFFZircone Blu
# 8EEBECLaguna Blu
# 50EBECCeleste
# 4EE2ECDiamante blu
# 81D8D0Tiffany Blue
# 92C7C7Ciano opaco
# 77BFC7Hosta blu
# 78C7C7Aurora boreale blu
# 48CCCDTurchese medio
# 43C6DBTurchese
# 46C7C7Medusa
# 7BCCB5Blu 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.

# 43BFC7Ara Blu Verde
# 3EA99FLight Sea Green
# 3B9C9CTurchese scuro
# 438D80Tartaruga Verde
# 348.781Acquamarina media
# 307D7EBlu verdastro
# 5E7D7ETurchese grigiastro
# 4C787EBeetle Green
# 008.080Teal
# 4E8975Mare verde
# 78866BVerde mimetico
# 848b79Verde salvia
# 617C58Verde nocciola
# 728C00Venom Green
# 667C26Fern Green
# 254117Dark Forest Green
# 306754Verde Mare Medio
# 347.235Verde medio foresta
# 437C17Alghe Verdi
# 387C44Verde pino
# 347C2CJungle Green
# 347C17Shamrock Green
# 348.017Verde medio primaverile
# 4E9258Verde foresta
# 6AA121Cipolla verde
# 4AA02CVerde primavera
# 41A317Verde lime
# 3EA055Clover Green
# 6CBB3CSerpente Verde
# 6CC417Alien Green
# 4CC417Mela verde
# 52D017Giallo verde
# 4CC552Kelly Green
# 54C571Zombie Green
# 99C68EFrog Green
# 89C35CPiselli verdi
# 85BB65Dollar Bill Green
# 8BB381Dark Sea Green
# 9CB071Iguana Green
# B2C248Verde avocado
# 9DC209Verde Pistacchio
# A1C935Insalata verde
# 7FE817Hummingbird Green
# 59E817Nebulosa Verde
# 57E964Semaforo Diventa Verde
# 64E986Alghe Verdi
# 5EFB6EVerde giada
# 00FF00verde
# 5FFB17Verde smeraldo
# 87F717Verde prato
# 8AFB17certosa
# 6AFB92Dragon Green
# 98FF98menta verde
# B5EAAAPollice verde
# C3FDB8Light Jade
# CCFB5DTè verde
# B1FB17Verde giallo
# BCE954Melma Verde
# EDDA74Verga d'oro
# EDE275Harvest Gold
# FFE87CSun 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.

# FFFF00Giallo
# FFF380Giallo mais
# FFFFC2Pergamena
#FFFFCCCrema
# FFF8C6Chiffon al limone
# FFF8DCCornsilk
# F5F5DCBeige
# FBF6D9bionda
# FAEBD7AntiqueWhite
# F7E7CEChampagne
#FFEBCDBlanchedAlmond
# F3E5ABVaniglia
# ECE5B6Marrone Chiaro
# FFE5B4pesca
# FFDB58Mostarda
# FFD801Rubber Ducky Yellow
# FDD017Oro brillante
# EAC117Marrone dorato
# F2BB66Maccheroni e formaggio
# FBB917Zafferano
# FBB117birra
# FFA62FCantalupo
# E9AB17Ape 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.

# E2A76FZucchero di canna
# DEB887burlywood
# FFCBA4Pesca profonda
# C9BE62Ginger Brown
# E8A317Scuolabus Giallo
# EE9A4DSandy Brown
# C8B560Foglia d'autunno marrone
# D4A017Orange Gold
# C2B280Sabbia
# C7A317Biscotto Marrone
# C68E17Caramello
# B5A642Ottone
# ADA96ECachi
# C19A6BMarrone cammello
# CD7F32Bronzo
# C88141Tiger Orange
# C58917Cannella
# AF9B60Bullet Shell
# AF7817Verga d'oro scuro
# B87333Rame
# 966F33Legna
# 806.517Rovere Marrone
# 827.839Mocassino
# 827B60Army Brown
# 786D5FArenaria
# 493D26moca
# 483C32taupe
# 6F4E37caffè
# 835C3BOrso bruno
# 7F5217Sporcizia rossa
# 7F462Cnero 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

# C47451Salmone all'arancia
# C36241Ruggine
# C35817Volpe rossa
# C85A17Cioccolato
# CC6600Sedona
# E56717Papaya Orange
# E66C2CHalloween Orange
# F87217Zucca Di Arancia
# F87431Cono di costruzione arancione
# E67451Sunrise Orange
# FF8040Mango Orange
# F88017Arancione scuro
# FF7F50Corallo
# F88158Basket Ball Orange
# F9966BSalmone Leggero
# E78A61Mandarino
# E18B6BSalmone Scuro
# E77471Corallo chiaro
# F75D59Bean Red
# E55451Valentine Red
# E55B3CArancia 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.

# FF0000Rosso
# FF2400Scarlatto
# F62217Rosso rubino
# F70D1AFerrari Red
# F62817Autopompa antincendio rossa
# E42217Lava Red
# E41B17Love Red
# DC381FPompelmo
# C34A2CCastano Rosso
# C24641Rosso ciliegia
# C04000Mogano
# C11B17Peperoncino
# 9F000FMirtillo
# 990.012Vino rosso
# 8C001ABorgogna
# 954.535Castagna
# 7E3517Sangue rosso
# 8A4117terra di siena
# 7E3817Sangria
# 800.517Firebrick
# 810.541Marrone
# 7D0541Plum Pie
# 7E354DVelvet Maroon
# 7D0552Plum Velvet
# 7F4E52Rosy Finch
# 7F5A58color pulce
# 7F525DViola opaco
# B38481Rosy Brown
# C5908EKhaki 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.

# C48189Arco rosa
# C48793Rossetto Rosa
# E8ADAARosa
# ECC5C0Oro rosa
# EDC9AFSabbia del deserto
# FDD7E4Rosa Maiale
#FCDFFFZucchero filato
#FFDFDDGomma da masticare rosa
# FBBBB9Misty Rose
#FAAFBERosa
#FAAFBARosa chiaro
# F9A7B0Flamingo Pink
# E7A1B0Rosa Rosa
# E799A3Pink Daisy
# E38AAECadillac Pink
# F778A1Garofano Rosa
# E56E94Blush Red
# F660ABRosa caldo
# FC6C85Anguria Rosa
# F6358ARosso viola
# F52887Rosa scuro
# E45E9DCupcake Rosa
# E4287CLimonata rosa
# F535AARosa fluo
# FF00FFMagenta
# E3319DDimorphotheca Magenta
# F433FFNeon rosa brillante
# D16587Pale Violet Red
# C25A7CTulip Pink
# CA226BRosso violaceo medio
# C12869Rogue Pink
# C12267Rosa bruciato
# C25283Rosa vergognoso
# C12283Garofano scuro rosa
# B93B8Fprugna

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.

# 7E587EViola Viola
# 571B7EIris viola
# 583.759Prugna Viola
# 4B0082Indaco
# 461B7EMostro Viola
# 4E387EPurple Haze
# 614.051Melanzana
# 5E5A80Uva
# 6A287EMarmellata Viola
# 7D1B7EOrchidea scura
# A74AC7Fiore viola
# B048B5Orchidea Media
# 6C2DC7Ametista Viola
# 842DCEViola scuro
# 8D38C9Viola
# 7A5DC7Bush salvia viola
# 7F38ECLovely Purple
# 8E35EFViola
# 893BFFAztech Purple
# 8467D7Viola medio
# A23BECJasmine Purple
# B041FFNarciso viola
# C45AECTyrian Purple
# 9172ECCrocus Purple
# 9E7BFFMimosa viola
# D462FFEliotropio Viola
# E238ECCremisi
# C38EC7Drago Viola
# C8A2C8Lilla
# E6A9ECBlush Pink
# E0B0FFMalva
# C6AEC7Glicine Viola
# F9B7FFBlossom Pink
# D2B9D3Cardo
# E9CFECPervinca
# EBDDE2Pinocchio alla lavanda
# E3E4FABlu lavanda
# FDEEF4Perla
# FFF5EEConchiglia
#FEFCFFBianco latte
#FFFFFFbianca

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# FF0000bianca#FFFFFF
Ciano# 00FFFFArgento# C0C0C0
Blu# 0000FFGrigio o grigio# 808080
Blu scuro# 0000A0Nero# 000000
Azzurro# ADD8E6arancia# FFA500
Viola# 800080Marrone# A52A2A
Giallo# FFFF00Marrone# 800000
Lime# 00FF00verde# 008000
Magenta# FF00FFOliva# 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ù–

  1. Stili di font HTML
  2. Attributi HTML
  3. Fogli di stile HTML
  4. Come funziona HTML
  5. Colori in Matlab | Come cambiare lo stile in Matlab?