Tutoriels
Step-by-step tutorials applying color science concepts to real-world design and development tasks.
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 adaptatifs.
Mis à jour Fév 24, 2026
Propriétés personnalisées CSS pour des systèmes de couleurs dynamiques
Apprenez à construire des systèmes de couleurs maintenables et thématisables avec les propriétés personnalisées CSS. Couvre les variables, les modes clair/sombre et les modifications de couleurs en JavaScript au moment de l'exécution.
Mis à jour Fév 18, 2026
Couleurs Tailwind CSS : guide complet du système de nuances
Maîtrisez le système de couleurs de Tailwind CSS : la palette par défaut, la convention de nuances 50-950, les couleurs personnalisées dans la config, et la nouvelle approche par variables CSS dans Tailwind v4.
Mis à jour Fév 11, 2026
Implémenter le mode sombre : guide complet pour les développeurs
Apprenez à implémenter le mode sombre avec les propriétés personnalisées CSS, prefers-color-scheme, les bascules JavaScript et les stratégies d'adaptation des couleurs pour tout projet web.
Mis à jour Fév 04, 2026
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 personnalisés avec Shadow DOM.
Mis à jour Fév 02, 2026
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 d'usage pratiques et créez des palettes dynamiques sans JavaScript.
Mis à jour Jan 31, 2026
Le gamut de couleurs expliqué : sRGB, P3 et Rec. 2020
Comprenez les gamuts de couleurs — sRGB, Display P3 et Rec. 2020 — et comment utiliser les couleurs grand gamut CSS avec @media (color-gamut) pour les écrans modernes. Exemples pratiques inclus.
Mis à jour Jan 28, 2026
Fonctions de couleur CSS : rgb(), hsl(), oklch() comparées
Comparez toutes les fonctions de couleur CSS — rgb(), rgba(), hsl(), hsla(), lab(), lch(), oklch() et color-mix(). Apprenez laquelle utiliser, dans quel contexte, et quel est le support navigateur.
Mis à jour Jan 22, 2026
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 utiliser pour le CSS et le travail de design.
Mis à jour Jan 22, 2026
Composants Figma avec mise en page automatique et tokens de couleur
Créez des composants Figma en mise en page automatique avec une architecture de tokens de couleur. Apprenez la liaison de variables, les tokens adaptatifs, les variantes de thèmes et le handoff développeur.
Mis à jour Jan 15, 2026
Épreuvage des couleurs : garantir une reproduction fidèle à l'impression
Maîtrisez l'épreuvage soft, l'épreuvage sur papier et les épreuves de presse pour assurer une reproduction des couleurs d'impression fidèle de l'écran à la sortie finale.
Mis à jour Jan 13, 2026
CMJN pour les Web Designers : Quand l'Impression Rencontre l'Écran
Les web designers qui travaillent sur des projets d'impression doivent comprendre le CMJN. Découvrez les différences de gamme, les stratégies de conversion RGB vers CMJN, les workflows d'épreuvage et les pièges courants.
Mis à jour Jan 12, 2026
L'influence du papier sur la couleur : support et qualité d'impression
Comprenez comment le type de papier, le couchage et le grammage influencent la couleur imprimée. Apprenez les différences entre papiers couchés, non couchés et spéciaux pour la précision colorimétrique.
Mis à jour Jan 09, 2026
Le dorure à chaud et les couleurs métalliques dans l'impression
Découvrez les techniques de dorure à chaud, les options d'encres métalliques, les choix de dorure or et argent, et les considérations de design pour les imprimés premium.
Mis à jour Jan 08, 2026
Architecture de couleurs multi-marques : un seul codebase, plusieurs thèmes
Construisez une architecture de couleurs multi-marques avec des propriétés CSS personnalisées et des tokens de design. Gérez le thème en marque blanche depuis un seul codebase avec l'intégration Tailwind.
Mis à jour Jan 06, 2026
La couleur en 3D et WebGL : espace colorimétrique linéaire et PBR
Comprenez la couleur dans le rendu 3D — sRGB vs RGB linéaire, correction gamma, couleurs de rendu physiquement réaliste, gestion des couleurs Three.js et HDR en 3D web.
Mis à jour Jan 02, 2026
La couleur au service de la narration de données : au-delà des palettes par défaut
Dépassez les palettes de graphiques par défaut pour raconter vos données. Apprenez les palettes séquentielles, divergentes et catégorielles, l'accessibilité en dataviz, et les échelles de couleurs D3/Chart.js.
Mis à jour Déc 29, 2025
Animation des couleurs en CSS : transitions et images clés
Maîtrisez l'animation des couleurs en CSS avec les transitions, les animations en images clés, la rotation de teinte HSL, l'interpolation OKLCH pour une fluidité perceptuelle et les bonnes pratiques de performance.
Mis à jour Déc 26, 2025
Fonction CSS light-dark() : bascule de thème native
Utilisez CSS light-dark() pour une bascule de thème native. Remplacez les bascules JavaScript et les media queries par une seule fonction CSS pour les couleurs en modes clair et sombre.
Mis à jour Déc 24, 2025
Le modèle de couleurs RVB : comment les écrans affichent les couleurs
Comprenez le modèle de couleurs RVB — le mélange de lumières rouge, verte et bleue, la plage 0–255, la fonction CSS rgb(), et pourquoi les écrans peuvent afficher 16,7 millions de couleurs.
Mis à jour Déc 20, 2025
Workflow de gestion des couleurs : de l'écran à l'impression
Maîtrisez la gestion des couleurs de l'étalonnage du moniteur à l'épreuvage. Profils ICC, épreuvage soft et workflow cohérent pour une couleur fidèle de l'écran à l'impression.
Mis à jour Déc 14, 2025
Construire un système de couleurs pour votre design system
Construisez une architecture de couleurs systématique pour votre design system : conventions de nommage, génération de nuances, tokens sémantiques et patterns d'implémentation.
Mis à jour Déc 09, 2025
Concevoir une API de couleurs : endpoints REST pour les données de couleur
Concevez une API REST de couleurs avec des endpoints pour la conversion, la recherche, la vérification du contraste et la génération de palettes. Apprenez la conception de schémas et les meilleures pratiques.
Mis à jour Déc 06, 2025
Techniques de couleur SVG : remplissage, contour et dégradés
Maîtrisez les techniques de couleur SVG : attributs fill et stroke, dégradés linéaires et radiaux, le mot-clé currentColor et le style SVG en CSS pour le développement web moderne.
Mis à jour Nov 29, 2025
La règle des 60-30-10 : les proportions de couleurs en design
Maîtrisez la règle des 60-30-10 pour vos compositions de couleurs. Découvrez comment les couleurs dominante, secondaire et d'accent s'articulent, avec des exemples concrets, des codes hex et des conseils pour transgresser la règle intelligemment.
Mis à jour Nov 24, 2025
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. Préparez des fichiers prêts à imprimer avec des séparations de couleurs correctes.
Mis à jour Nov 21, 2025
HSL vs HSV : quel modèle de couleur utiliser ?
Comprenez la difference entre les modèles de couleur HSL et HSV, quand chacun est approprié pour le développement web ou les sélecteurs de couleur, et comment ils se comparent aux fonctions de couleur CSS.
Mis à jour Nov 19, 2025
Systèmes de couleurs sémantiques : nommer les couleurs par usage, pas par teinte
Construisez des systèmes de couleurs sémantiques qui nomment les couleurs par rôle (succès, avertissement, erreur) plutôt que par teinte. Architecture des tokens et implémentation en CSS et Tailwind.
Mis à jour Nov 14, 2025
Syntaxe des couleurs relatives CSS : transformer n'importe quelle couleur dynamiquement
Maîtrisez la syntaxe des couleurs relatives CSS pour transformer les couleurs dynamiquement. Ajustez la teinte, la saturation, la luminosité et les canaux alpha directement dans vos feuilles de style.
Mis à jour Nov 10, 2025
Concevoir pour le mode contraste élevé : Windows, macOS et web
Concevez pour le mode contraste élevé sur Windows, macOS et le web. Apprenez le CSS forced-colors, les mots-clés de couleurs système, les stratégies de test et les pièges courants à éviter.
Mis à jour Nov 06, 2025
Comprendre les codes couleur hexadécimaux : le guide complet
Maîtrisez les codes couleur hexadécimaux depuis les bases. Apprenez ce que signifie #RRGGBB, comment lire n'importe quelle valeur hex, la notation abrégée, la transparence alpha et comment convertir entre formats.
Mis à jour Oct 29, 2025
La couleur dans l'art génératif : algorithmes pour de belles palettes
Créez de belles couleurs dans l'art génératif avec les spirales HSL, les palettes à base de bruit, l'échantillonnage au nombre d'or et les algorithmes de couleur p5.js.
Mis à jour Oct 26, 2025
Thématisation dynamique des couleurs en React : au-delà des variables CSS
Implémentez une thématisation dynamique des couleurs en React avec des variables CSS, des fournisseurs de contexte et Tailwind CSS. Créez des thèmes personnalisables à l'exécution avec génération de couleurs dynamique.
Mis à jour Oct 23, 2025
Le Pantone Matching System expliqué : guide du designer
Apprenez le fonctionnement du Pantone Matching System, la différence entre les livres couché et non couché, les couleurs de surface vs quadrichromie, et les limites de la conversion Pantone vers hex.
Mis à jour Oct 19, 2025
L'accessibilité au-delà du contraste : la couleur dans le design inclusif
L'accessibilité des couleurs va bien au-delà des rapports de contraste. Apprenez le principe WCAG « pas uniquement par la couleur », les indicateurs de focus, les états d'erreur et les bonnes pratiques pour les daltoniens.
Mis à jour Oct 17, 2025
Couleurs en sérigraphie : guide pour les designers
Maîtrisez les techniques de couleur en sérigraphie : séparation des couleurs, trames de simili, encres en teintes directes et préparation des fichiers pour les impressions sérigraphiées.
Mis à jour Oct 14, 2025
Interpolation de couleur en CSS : pourquoi OKLCH l'emporte
L'interpolation de couleur CSS détermine comment les dégradés et color-mix() mélangent les couleurs. Pourquoi OKLCH produit des résultats vifs et perceptuellement uniformes là où RGB et HSL échouent.
Mis à jour Oct 12, 2025
Liste de contrôle de l'accessibilité des couleurs pour les développeurs web
Une liste de contrôle complète de l'accessibilité des couleurs pour les développeurs web, couvrant les ratios de contraste WCAG, la dépendance à la couleur seule, les indicateurs de focus, les outils de test et les vérifications automatisées.
Mis à jour Oct 07, 2025
Manipulation des couleurs en JavaScript : bibliothèques et techniques
Maîtrisez la manipulation des couleurs en JavaScript avec chroma.js, culori et tinycolor2. Analysez, transformez et générez des couleurs par programme pour vos applications web.
Mis à jour Oct 02, 2025
La couleur dans l'animation web : GSAP, Framer Motion et CSS
Maîtrisez l'animation de couleur avec les transitions CSS, GSAP et Framer Motion. Interpolation OKLCH, techniques par images clés et optimisation des performances.
Mis à jour Sep 29, 2025
Couleurs d'aplat vs couleurs quadri : guide des couleurs d'impression
Comprenez la différence entre les couleurs d'aplat et les couleurs quadri CMJN, quand utiliser chacune, leur impact sur les coûts d'impression et comment préparer correctement les fichiers pour chaque méthode.
Mis à jour Sep 27, 2025
Algorithmes de contraste des couleurs : WCAG 2 vs APCA
Comprenez comment WCAG 2 (luminance relative) et APCA (algorithme de contraste perceptuel avancé) calculent le contraste. Comparez les résultats et apprenez lequel utiliser pour une conception accessible.
Mis à jour Sep 25, 2025
Système de couleurs SwiftUI : construire des palettes de couleurs adaptatives
Construisez des palettes de couleurs adaptatives en SwiftUI. Apprenez Color vs UIColor, les couleurs du catalogue d'assets, les couleurs dynamiques en mode sombre et les patterns d'accessibilité des couleurs.
Mis à jour Sep 19, 2025
Design tokens de couleur : de Figma au code
Implémentez des design tokens de couleur de Figma jusqu'au code de production avec Style Dictionary. Apprenez la nomenclature, la transformation et la génération multiplateforme.
Mis à jour Sep 12, 2025
Conventions de nommage des couleurs en CSS et systèmes de design
Couleurs nommées CSS, nommage sémantique avec propriétés personnalisées, nommage par échelle Tailwind et bonnes pratiques pour gérer les noms de couleur en équipe.
Mis à jour Sep 06, 2025
La couleur dans le design d'e-mails : ce qui fonctionne selon les clients
Maîtrisez la couleur dans les e-mails pour Outlook, Gmail et Apple Mail. Stratégies fiables, correctifs pour le mode sombre et styles inline pour un rendu cohérent.
Mis à jour Sep 05, 2025
Gestion des thèmes de couleurs en React : variables CSS et Context
Construisez une gestion de thèmes de couleurs évolutive en React avec les propriétés CSS personnalisées et l'API Context. Couvre l'architecture de thème, les thèmes Tailwind CSS et les stratégies multi-marques.
Mis à jour Sep 03, 2025
Performance des couleurs web : dégradés, ombres et filtres
Optimisez la performance des couleurs web. Découvrez comment les dégradés, box-shadows, filtres CSS et backdrop-filter affectent le rendu et comment les accélérer avec le GPU.
Mis à jour Sep 01, 2025
Couleurs responsives : adapter les couleurs aux différents écrans
Découvrez comment les couleurs varient selon les écrans, les gamuts et le mode sombre. Utilisez les media queries CSS et les propriétés personnalisées pour créer des systèmes de couleurs adaptatifs.
Mis à jour Aoû 31, 2025
Combinaisons de couleurs pour une signalétique à visibilité maximale
Découvrez les combinaisons de couleurs les plus lisibles en signalétique : recherches sur la lisibilité à distance, exigences ADA, considérations LED et effets des matériaux et de l'éclairage.
Mis à jour Aoû 30, 2025
Comment Choisir les Couleurs de sa Marque : Guide Étape par Étape
Un guide étape par étape pour choisir des couleurs de marque qui résonnent avec votre audience. Couvre la recherche, l'analyse concurrentielle, la psychologie des couleurs, les tests de combinaisons et la documentation des chartes graphiques.
Mis à jour Aoû 29, 2025