Generatore di colori casuali

Divulgazione: ricevo commissioni per gli acquisti effettuati tramite i link presenti in questa pagina. Ciò contribuisce al mantenimento di questo sito.

Ecco un utile generatore di colori casuali. Genera e mostra i colori insieme ai codici esadecimali per l'uso in qualsiasi software di grafica. Viene mostrato anche il codice CSS in modo da poter utilizzare questi colori in un sito web.

Vengono date due versioni di ogni colore; una con testo bianco e una con testo nero.

supposedly #3C6213


.color-supposedly, .color-hover-supposedly:hover {color:#FFF!important; background-color:#3C6213!important}

supposedly #3C6213


.color-supposedly, .color-hover-supposedly:hover {color:#000!important; background-color:#3C6213!important}

exactly #54A7A7


.color-exactly, .color-hover-exactly:hover {color:#FFF!important; background-color:#54A7A7!important}

exactly #54A7A7


.color-exactly, .color-hover-exactly:hover {color:#000!important; background-color:#54A7A7!important}

fully #FEFFC5


.color-fully, .color-hover-fully:hover {color:#FFF!important; background-color:#FEFFC5!important}

fully #FEFFC5


.color-fully, .color-hover-fully:hover {color:#000!important; background-color:#FEFFC5!important}

angrily #285CD8


.color-angrily, .color-hover-angrily:hover {color:#FFF!important; background-color:#285CD8!important}

angrily #285CD8


.color-angrily, .color-hover-angrily:hover {color:#000!important; background-color:#285CD8!important}


 

Accedere a qualsiasi cosa online con NordVPN


 

Colori casuali per qualsiasi scopo

Se stai cercando ispirazione per qualche grafica che stai progettando, o se stai creando un sito web, il nostro generatore di colori casuali è una buona scelta. I codici esadecimali sono forniti per ogni colore generato.

Mostriamo anche come questi colori apparirebbero con testo bianco e con testo nero, per aiutarti a farti un'idea di come vorresti usarli.

Se non ti piace nessuno dei colori generati, premi semplicemente "Generate New". Attenzione però - non puoi riavere i vecchi colori, quindi se c'è qualcosa che ti piace, copia e salva i codici esadecimali prima di premere il pulsante.

Qui c'è qualcosa per tutti. Con una quantità quasi infinita di colori che possono essere generati, hai un sacco di opzioni tra cui scegliere.

Come generiamo i colori

Questi colori sono il più casuale possibile. Sono generati scegliendone uno a caso tra tutte le lettere esagonali possibili in ciascuna delle 6 diverse posizioni del codice esagonale.

Nomi dei colori

I nomi dei colori mostrati qui sono solo nomi temporanei che usiamo come segnaposto. Se avete bisogno di usare questi colori, per la vostra comodità dovreste probabilmente rinominarli come volete. Volevamo essere sicuri che i nomi che abbiamo dato non fossero in conflitto con altri nomi di colori esistenti che potresti usare nel tuo progetto (ad esempio verde chiaro).

I nomi dei colori che abbiamo dato potrebbero essere riutilizzati per altri colori che vengono generati usando "Generate New", quindi non assumete che i nostri nomi siano unici per un colore specifico. È anche teoricamente possibile, ma improbabile, che due colori diversi sulla stessa pagina abbiano lo stesso nome.

Per i web designer

CSS

Se hai intenzione di usare questi colori per il web, dovrai copiare e incollare il codice CSS per quel colore (mostrato nelle caselle dei colori) nel tuo foglio di stile esistente. Ricordati di decidere se vuoi la versione con testo nero o con testo bianco, dato che il loro codice CSS è diverso. Come detto sopra, dovrai cambiare il nome del colore nel tuo file CSS in qualcosa che sia idealmente significativo per te dal punto di vista del colore e che non sia già in uso con lo stesso nome nel tuo foglio di stile esistente.

Tutti i nostri nomi segnaposto terminano con le lettere "ly" per rendere un po' più facile se hai bisogno di cercare nel tuo foglio di stile quelli che potresti aver dimenticato di modificare.

HTML

Dopo aver copiato il codice CSS nel tuo foglio di stile, puoi usare qualsiasi di questi colori nel tuo HTML come segue:

<div class="angrily">
<h3>Heading</h3>
<p>Paragraph content</p>
</div>

Nell'esempio qui sopra puoi vedere che potrebbe essere meglio cambiare il nome con un colore significativo.

Gli sfondi scuri avranno automaticamente il testo bianco, quindi non sarà necessario specificare separatamente il colore dello sfondo e il colore del testo.

Questa pagina è stata aggiornata l'ultima volta il 19 ottobre 2022