Design

Dégradé

Une transition douce et continue entre deux couleurs ou plus sur un espace défini.

Gradients can be linear (transitioning along a straight line), radial (transitioning outward from a center point), or conic (transitioning around a center point). In CSS, they are implemented as background-image values using linear-gradient(), radial-gradient(), and conic-gradient() functions. Gradients add depth, dimension, and visual interest to designs. Modern design trends favor subtle gradients for backgrounds and bold, multicolor gradients for branding (as seen with Instagram and Firefox). When creating gradients between certain color pairs, desaturated or muddy midpoints can occur; using OKLCH interpolation helps maintain vivid colors throughout the transition.

Essayez

Générateur de palettes

Générez des palettes de couleurs harmonieuses en utilisant des schémas complémentaires, analogues, triadiques et complémentaires divisés.

Générateur de nuances

Générez des échelles de nuances style Tailwind CSS (50–950) à partir de n'importe quelle couleur de base pour les systèmes de design.

Articles associés

CSS color-mix() : mélanger des couleurs nativement dans le navigateur

Apprenez à utiliser CSS color-mix() pour mélanger des couleurs nativement dans le navigateur. Maîtrisez la syntaxe, les espaces colorimétriques, les cas

Créer un sélecteur de couleur Web Component from scratch

Créez un sélecteur de couleur accessible en tant que Web Component. Implémentez le rendu canvas, les curseurs de teinte, les canaux alpha et les événements

Espaces colorimétriques perceptuels : Lab, LCH, Oklab, OKLCH

Explorez les espaces colorimétriques perceptuellement uniformes — CIE Lab, LCH, Oklab et OKLCH. Apprenez comment chacun a été conçu, ses points forts et lequel

Générer des images OG colorées avec Next.js et Satori

Générez des images Open Graph dynamiques avec Next.js et Satori. Créez des templates OG adaptés aux couleurs avec dégradés, couleurs de marque et designs

La séparation des couleurs expliquée : préparer les fichiers pour l'impression

Comprenez la séparation des couleurs CMJN, les plaques de tons directs, le recouvrement et les repères de repérage.

Couleurs de Marque Chainlink : Le Bleu Oracle et l'Hexagone

Explorez le bleu distinctif de Chainlink (#375BD2) et le symbolisme du logo hexagonal. Découvrez comment l'identité visuelle d'un réseau oracle construit la