Outils couleur, imprimés nets.

Générez des harmonies complémentaires, analogues, triadiques et plus encore à partir de n'importe quelle couleur de base. Exportez en variables CSS, configuration Tailwind, SCSS ou JSON.

Collez n'importe quelle valeur de couleur et visualisez-la instantanément en HEX, RGB, RGBA, HSL, HSLA et HSV. Copiez n'importe quel format en un clic.

Vérifiez les paires de couleurs avant-plan et arrière-plan par rapport aux exigences WCAG 2.1 AA et AAA pour texte normal et texte agrandi.

Mélangez deux couleurs dans n'importe quel ratio, en espace RGB ou HSL, et copiez instantanément les valeurs hex, RGB et HSL résultantes.

Déposez une image et extrayez ses couleurs dominantes avec la quantification median-cut. Exportez en variables CSS, configuration Tailwind, SCSS ou JSON.

Visualisez votre palette à travers sept types de déficiences de la vision des couleurs. Repérez les paires qui se confondent pour les ~8 % d'utilisateurs avec confusion rouge/vert.

Trouvez la couleur CSS nommée la plus proche de n'importe quel hex avec la distance perceptuelle Lab, ou retrouvez le hex exact derrière n'importe quel mot-clé CSS.

Construisez une échelle tonale (50–950) à partir de n'importe quelle couleur de marque et consultez les évaluations de contraste WCAG AA/AAA de chaque nuance face au blanc, au noir et au reste de l'échelle.

Créez des dégradés CSS linéaires, radiaux et coniques avec plusieurs arrêts de couleur, un contrôle d'angle et un aperçu en temps réel.

Empilez plusieurs box-shadows avec un contrôle total sur offset, blur, spread, couleur et inset. Copiez le CSS instantanément.

Empilez des couches de text-shadow pour des ombres portées, des lueurs néon, du 3D, du letterpress et des ombres longues. Prévisualisez sur du texte réel et copiez le CSS.

Combinez blur, brightness, contrast, grayscale, hue-rotate, invert, opacity, saturate et sepia en un seul filtre CSS avec aperçu en direct sur image ou texte.

Faites glisser les deux points de contrôle pour concevoir vos propres courbes d'easing cubic-bezier(). Comparez à ease, ease-in, ease-out et observez la courbe animer en direct.

Réglez les quatre coins indépendamment ou utilisez la syntaxe elliptique à 8 valeurs. Voyez la forme se mettre à jour en direct.

Dessinez vos propres polygones clip-path avec un éditeur interactif, ou partez de préréglages comme triangles, hexagones et flèches.

Téléchargez une image ou créez une icône à partir d'une lettre, puis téléchargez toutes les tailles PNG nécessaires pour les navigateurs modernes et les manifestes web.