Générateur de couleurs aléatoires

Divulgation : Je reçois des commissions pour les achats effectués par le biais des liens figurant sur cette page. Cela permet de maintenir ce site en activité.

Voici un générateur de couleurs aléatoires très utile. Il génère et affiche des couleurs avec des codes hexadécimaux à utiliser dans n'importe quel logiciel graphique. Le code CSS est également indiqué pour que vous puissiez utiliser ces couleurs dans un site Web.

Deux versions de chaque couleur sont données : une avec du texte blanc et une avec du texte noir.

likely #17C96C


.color-likely, .color-hover-likely:hover {color:#FFF!important; background-color:#17C96C!important}

likely #17C96C


.color-likely, .color-hover-likely:hover {color:#000!important; background-color:#17C96C!important}

genuinely #777FB5


.color-genuinely, .color-hover-genuinely:hover {color:#FFF!important; background-color:#777FB5!important}

genuinely #777FB5


.color-genuinely, .color-hover-genuinely:hover {color:#000!important; background-color:#777FB5!important}

artfully #638B65


.color-artfully, .color-hover-artfully:hover {color:#FFF!important; background-color:#638B65!important}

artfully #638B65


.color-artfully, .color-hover-artfully:hover {color:#000!important; background-color:#638B65!important}

awkwardly #E71AEC


.color-awkwardly, .color-hover-awkwardly:hover {color:#FFF!important; background-color:#E71AEC!important}

awkwardly #E71AEC


.color-awkwardly, .color-hover-awkwardly:hover {color:#000!important; background-color:#E71AEC!important}


 

Accédez à tout ce que vous voulez en ligne avec NordVPN


 

Des couleurs aléatoires pour tous les usages

Que vous cherchiez de l'inspiration pour des graphiques que vous concevez, ou que vous créiez un site Web, notre générateur de couleurs aléatoires est un bon choix. Les codes hexadécimaux sont donnés pour chaque couleur générée.

Nous montrons également comment ces couleurs se présenteraient avec du texte blanc et du texte noir, pour vous aider à vous faire une idée de la façon dont vous souhaitez les utiliser.

Si vous n'aimez pas l'une des couleurs générées, il vous suffit de cliquer sur "Generate New". Mais attention, vous ne pourrez pas récupérer les anciennes couleurs, alors si vous aimez quelque chose, copiez et enregistrez les codes hexadécimaux avant d'appuyer sur le bouton.

Il y en a pour tous les goûts. Avec une quantité presque infinie de couleurs qui peuvent être générées, vous avez beaucoup d'options à choisir.

Comment nous générons les couleurs

Ces couleurs sont aussi aléatoires que possible. Elles sont générées en choisissant une couleur au hasard parmi toutes les lettres hexagonales possibles à chacune des 6 positions différentes du code hexagonal.

Noms des couleurs

Les noms de couleurs indiqués ici sont des noms temporaires que nous utilisons comme caractères de substitution. Si vous avez besoin d'utiliser ces couleurs, pour votre propre commodité, vous devriez probablement les renommer comme vous le souhaitez. Nous voulions nous assurer que les noms que nous avons donnés n'entraient pas en conflit avec d'autres noms de couleurs existants que vous pourriez utiliser dans votre projet (par exemple, vert clair).

Les noms de couleur que nous avons donnés peuvent être réutilisés pour d'autres couleurs générées à l'aide de l'option "Generate New", donc ne supposez pas que nos noms sont uniques pour une couleur spécifique. Il est même théoriquement possible, mais peu probable, que deux couleurs différentes sur la même page aient le même nom.

Pour les concepteurs de sites Web

CSS

Si vous avez l'intention d'utiliser ces couleurs sur le Web, vous devez copier et coller le code CSS correspondant à la couleur (indiqué dans les cases de couleur) dans votre feuille de style existante. N'oubliez pas de décider si vous voulez la version avec texte noir ou avec texte blanc, car leur code CSS est différent. Comme nous l'avons mentionné plus haut, vous devrez modifier le nom de la couleur dans votre fichier CSS pour qu'il ait un sens pour vous en termes de couleur et qu'il ne soit pas déjà utilisé sous le même nom dans votre feuille de style existante.

Tous nos noms de remplacement se terminent par les lettres "ly" pour vous faciliter la tâche si vous devez rechercher dans votre feuille de style ceux que vous auriez oublié de modifier.

HTML

Après avoir copié le code CSS dans votre feuille de style, vous pouvez utiliser n'importe laquelle de ces couleurs dans votre HTML comme suit :

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

Dans l'exemple ci-dessus, vous pouvez voir qu'il serait préférable de changer le nom en une couleur significative.

Les fonds sombres seront automatiquement accompagnés d'un texte blanc, de sorte que vous n'aurez pas besoin de spécifier séparément la couleur du fond et celle du texte.

Cette page a été mise à jour pour la dernière fois le 19 octobre 2022