Dans son article, Josh W. Comeau explore les défis et solutions pour créer des effets de décalage de couleurs dynamiques en CSS, notamment pour des animations de particules. Il explique d’abord comment générer des couleurs aléatoires en HSL pour une cohérence visuelle, mais souligne une limitation majeure : les navigateurs interpolent les couleurs en RGB, ce qui produit des teintes grisées et peu naturelles lors des transitions entre deux couleurs HSL. Par exemple, une transition entre rouge et turquoise passe par du gris, car les canaux RGB convergent vers des valeurs similaires. Pour contourner ce problème, il propose d’utiliser la propriété CSS filter: hue-rotate(), qui permet de faire tourner la teinte de manière fluide et naturelle autour de la roue chromatique, sans perte de saturation. Il partage aussi des astuces pour ajouter des effets de scintillement aléatoires aux particules, améliorant ainsi le réalisme de l’animation.
Un article très complet sur les représentations cylindriques (3 coordonnées dans l'espace des couleurs : le degré dans le cercle chromatique, l'intensité / saturation, et la clarté / brillance)
Un excellent article sur Oklch, une nouvelle syntaxe pour décrire une couleur en CSS - l'auteur explique l'intérêt de celle-ci relativement au gamut Display P3. C'est d'ores et déjà utilisable et le fallback n'est pas compliqué.
L'auteur montre aussi l'utilisation de variables CSS pour créer des déclinaisons
L'auteur présente les formats utilisables tels que les noms de couleur, rgb et hsl, mais aussi des formats à venir / en cours d'implémentation comme lch.
Il termine en préconisant hsl car ce format est bien plus intuitif (couleur devinable) et manipulable (facile d'éclaircir / assombrir)
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
La suite de https://v6.robweychert.com/blog/2017/11/v6-typography-proportions/ : l'auteur explique comment il a construit sa (ses) palette(s) de couleur - très instructif !
Tout est dans le titre
Tout est dans le titre
L'auteur explique pourquoi elle a opté pour HSL dans la définition des couleurs... c'est très clair et convaincant, et l'utilisation via des custom properties est très intéressante (via https://www.smashingmagazine.com/2018/09/monthly-web-development-update-9-2018/ )
Tout est dans le titre (via https://blog.stephaniewalter.fr/la-semaine-en-pixels-2-september-2018/ )