Come trovare colori HTML e il valore esadecimale online


Postato in data Aprile 26th, da Riccardo Esposito in Blog. No Comments

I colori HTML sono importanti per chi si occupa di web e lavora con i siti personali o dei clienti. Vero, tutto parte da un buon hosting WordPress veloce e performante. Ma continua con plugin affidabili e un template capace di restituire l’estetica necessaria per comunicare i valori.

colori html
Quale colore scegli per il sito?

Ecco perché può essere necessario scoprire i colori da riportare in alcune sezioni del sito. Non sempre l’estetica di un tema è già pronta per accogliere le tue esigenze. Ma come si modifica l’aspetto e in che modo si scelgono i colori sul web? Devi conoscere il valore esadecimale della cromia che vuoi usare, in questo articolo voglio lasciarti una breve guida sull’argomento.

Cosa sono i valori esadecimali dei colori?

Per rappresentare le variazioni cromatiche sul web con precisione e senza fraintendimenti, cercando di trovare il modo per concordare il risultato tra i diversi dispositivi, puoi usare il valore esadecimale. Che, appunto, sono supportati da tutti i browser.

Per spiegare questo passaggio bisogna fare una breve sintesi. I colori HTML sono definiti attraverso il sistema RGB (red, green, blue) che sintetizza i primari additivi. Il valore di ogni elemento passa da 0 a 225 che indicano rispettivamente minima e massima presenza di quel determinato colore.

Per definire tutto in maniera più conveniente vengono usate tre coppie di numeri esadecimali. Così otteniamo una situazione del genere, ecco la tabella per farti un esempio.

ColoreValoreDefinizione
Nero#000000Assenza di tutti colori.
Bianco#FFFFFFPresenza di tutti i colori.
Rosso#FF0000Presenza solo del rosso.
Giallo#FFFF00Rosso + verde – blu.

Lo puoi intuire, esistono migliaia di combinazioni che coprono lo spettro dei colori. In questo modo è possibile attribuire a ogni elemento di una pagina web delle caratteristiche. Ecco come appare, ad esempio, dal punto di vista del codice HTML l’attribuzione di colore a parola.

<font color="#FFFF00">giallo</font>

Ovviamente questa è la soluzione più semplice, di solito si interviene lato CSS per attribuire a ogni elemento del sito web una caratteristica cromatica. E per far combaciare tutto può far comodo avere una serie di strumenti per scoprire, rilevare e ottenere gli esadecimali.

Da leggere: quali sono gli status code di una pagina web?

Generatore colori HTML: dove trovo i codici?

La prima esigenza: hai bisogno di uno schema che sintetizzi le sfumature cromatiche per i colori HTML. Sai qual è la verità pura e semplice: impossibile racchiuderli tutti. O meglio, avresti bisogno di un archivio infinito. Di solito nelle tabelle trovi gli esadecimali base:

NomeEsadecimaleRGB
Bianco#FFFFFFRGB(255, 255, 255)
Grigio#808080RGB(128, 128, 128)
Nero#000000RGB(0, 0, 0)
Rosso#FF0000RGB(255, 0, 0)
Marrone#800000RGB(128, 0, 0)
Giallo#FFFF00RGB(255, 255, 0)
Verde#008000RGB(0, 128, 0)
Blu#0000FFRGB(0, 0, 255)

Non conviene, però, incasellare tutti questi codici. Per questo esistono diverse applicazioni online che sintetizzano il lavoro. In che modo? Offrono delle tavolozze per catturare il colore che ti serve e determinare l’esadecimale, la combinazioni di lettere e numeri con cancelletto.

trovare colore html
Individuare il colore HTML online.

Il web è pieno di tool per generare colori HTML, ma il più famoso e utile (ma anche completo ed efficace) si trova sul sito di www.w3schools.com. Questo colors picker, infatti, ti consente di inserire l’input sia testuale che visivo. Da qui determina l’esadecimale e il valore RGB.

Posso prelevare colore da immagine sul web?

Una delle funzioni più richieste: trovare i colori HTML da un’immagine o una foto. In che modo si può fare? Con i vari Photoshop e Gimp è facile, hai il pick color e tutti i dati dei colori scelti. Ma come prelevare il colore di un elemento visual da internet in pochi secondi?

scoprire colore html
Definire il colore del sito.

Puoi usare imagecolorpicker.com, applicazione online semplice e immediata. Basta andare sul sito, caricare l’immagine o la foto e selezionare il cursore dove serve. In questo modo ottieni i codici HTML, RGB e HSV. Puoi ottenere il visual da analizzare inserendo anche URL immagine o del sito web. In modo da catturare una schermata della risorsa in questione.

Scoprire colori esadecimali online: usa il browser

Sia Firefox che Chrome ti consentono di analizzare il codice per identificare i codici esadecimali di ogni elemento delle pagine web. Ma questi sono trucchi per webmaster, se vuoi velocizzare le operazioni e scoprire i colori HTML delle risorse online puoi usare Colorzilla.

colori html - colorzilla
Ecco l’add-on all’opera sul tuo browser.

Puoi trovare quest’estensione per entrambi i browser. Cosa fa esattamente? Semplice, aggiunge un contagocce nell’angolo in alto a destra del browser: clicca e porta il cursore sull’immagine o la grafica. Qui puoi ottenere tutte le informazioni utili sulla sfumatura cromatica.

Da leggere: usare Lighthouse di Chrome

Colori HTML: tu come gestisci questa risorsa?

Questi sono i passaggi essenziali da sapere per portare avanti il tuo lavoro. Se hai bisogno di scoprire il codice esadecimale dei colori HTML non puoi ignorare queste risorse. Ne conosci altre? Vuoi dare il tuo contributo sul tema? Ti aspetto nei commenti dell’articolo.

Riccardo Esposito

Blogger per Serverplan, webwriter freelance e autore di My Social Web. Scrivo ogni giorno. Ho pubblicato un libro dedicato al mondo del blogging. Ah, l'ho già detto che scrivo?

Latest posts by Riccardo Esposito (see all)





Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

*

Shares