Outils Couleurs
Générez, analysez et exportez des palettes de couleurs pour vos projets.
Sélectionner une couleur
Prélevez une couleur précise depuis une image et récupérez ses valeurs HEX, RGB, HSL et HSV pour les réutiliser dans votre projet.
Extraire les couleurs d’une image
Analysez une image pour récupérer ses principales couleurs et constituer une palette avec les valeurs correspondantes.
Générer une palette depuis une image
Créez une palette à partir des couleurs détectées dans une image et récupérez les différentes teintes pour votre projet.
Identifier les couleurs dominantes
Repérez les couleurs les plus présentes dans une image et consultez leurs valeurs pour comprendre rapidement sa palette principale.
Trouver des couleurs similaires
Choisissez une couleur et trouvez des teintes proches pour compléter une palette ou explorer différentes variations du même ton.
Convertir une couleur
Convertissez une couleur entre HEX, RGB, HSL, HSV, CMYK, LAB et OKLCH et récupérez immédiatement les valeurs correspondantes.
Vérifier le contraste des couleurs
Comparez une couleur de texte et une couleur de fond pour vérifier leur rapport de contraste selon les critères WCAG.
Exporter une palette
Exportez votre palette dans les formats proposés, comme CSS, SCSS, JSON ou ASE, afin de la réutiliser dans votre projet.
Prévisualiser une palette
Appliquez votre palette à différents éléments visuels pour vérifier comment les couleurs fonctionnent ensemble avant de les utiliser.
Télécharger une palette
Enregistrez votre palette sous forme d’image avec ses couleurs et leurs codes afin de la conserver, la présenter ou la partager.
Partager une palette
Générez un lien permettant de transmettre votre palette et ses valeurs de couleurs à un collègue, un client ou un autre appareil.
Créer des harmonies de couleurs
Choisissez une couleur de base et générez des harmonies complémentaires, analogues, triadiques ou tétradiques autour de celle-ci.
Générer un dégradé CSS
Créez un dégradé linéaire, radial ou conique, ajustez ses couleurs et ses paramètres puis récupérez le code CSS correspondant.
Créer un dégradé mesh
Composez un dégradé mesh à plusieurs couleurs et ajustez les différents points pour obtenir le fond multicolore souhaité.
Créer un dégradé animé
Configurez les couleurs, la direction et la vitesse d’un dégradé animé puis récupérez le code CSS nécessaire à son animation.
Simuler le daltonisme
Simulez différentes déficiences de perception des couleurs pour vérifier si les éléments importants de votre palette restent distinguables.
Tester la lisibilité du texte
Comparez une couleur de texte et une couleur d’arrière-plan pour vérifier leur lisibilité dans différentes conditions d’affichage.
Analyser une palette avec WCAG
Analysez les contrastes entre les couleurs de votre palette et repérez les associations qui respectent les niveaux WCAG AA ou AAA.
Créer un effet glassmorphism
Réglez la transparence, le flou et les couleurs d’un effet de verre puis récupérez les propriétés CSS nécessaires à son utilisation.
Créer un effet neumorphique
Ajustez les ombres claires et foncées, le relief et les arrondis pour créer un effet neumorphique et récupérer son code CSS.
Créer une ombre colorée
Choisissez la couleur, le flou, l’étalement et le décalage de votre ombre puis récupérez la propriété CSS box-shadow correspondante.
Appliquer un effet duotone
Choisissez deux couleurs pour transformer les ombres et les lumières d’une image puis prévisualisez et exportez le résultat.
Appliquer un filtre de couleur
Ajoutez une couleur à votre image puis ajustez le mode de fusion et l’opacité pour obtenir le rendu visuel souhaité.
Créer un moodboard de couleurs
Assemblez des couleurs et des images de référence dans une même planche afin de construire et présenter une direction visuelle cohérente.
Mélanger des couleurs
Combinez plusieurs couleurs, ajustez leur proportion dans le mélange et récupérez la teinte résultante ainsi que ses valeurs.
Générer des teintes et nuances
Partez d’une couleur de base et générez une échelle de variantes plus claires et plus foncées avec leurs codes correspondants.
Générer une palette aléatoire
Créez une nouvelle palette de couleurs et choisissez éventuellement un type d’harmonie avant de générer une autre combinaison.
Générer une palette par mot-clé
Entrez un thème ou un mot-clé pour obtenir une palette associée et récupérer les différentes couleurs proposées.
Générer une palette Tailwind CSS
Choisissez une couleur de base et créez une échelle Tailwind de plusieurs niveaux prête à être intégrée dans votre configuration.
Générer des variables CSS
Transformez votre palette en propriétés personnalisées CSS avec des noms de variables prêts à être copiés dans votre feuille de styles.
Générer un thème shadcn/ui
Créez les variables de couleurs nécessaires à un thème shadcn/ui et prévisualisez leur rendu en modes clair et sombre.
Générer des variables SCSS
Transformez les couleurs de votre palette en variables SCSS ou Sass prêtes à être copiées et réutilisées dans vos styles.
Analyser la température d’une couleur
Analysez une couleur pour situer sa tonalité entre chaud, froid et neutre et consultez les valeurs utilisées pour cette interprétation.
Explorer les associations d’une couleur
Choisissez une couleur pour consulter les associations courantes qui lui sont attribuées et découvrir différents usages possibles en design.
Consulter les couleurs de marques
Recherchez une marque dans le catalogue pour consulter ses couleurs enregistrées et copier rapidement les codes HEX disponibles.
Découvrir les tendances de couleurs
Parcourez les sélections de couleurs et de palettes proposées pour découvrir différentes tendances et récupérer les codes qui vous intéressent.
Appliquer une carte de dégradé
Remappez les zones sombres et claires d’une image à l’aide d’un dégradé personnalisé puis prévisualisez et exportez le résultat.
Ajouter une superposition de couleur
Superposez une couleur à votre image et ajustez son opacité ainsi que le mode de fusion pour modifier son ambiance générale.
Générer une palette monochrome
Choisissez une seule couleur et créez plusieurs variations de luminosité et de saturation pour construire une palette monochromatique.
Générer des couleurs complémentaires
Choisissez une couleur de base et obtenez sa couleur opposée sur le cercle chromatique ainsi que les variations proposées autour du résultat.
Prévisualiser une palette dans une interface
Testez votre palette sur des boutons, cartes, champs et autres composants pour vérifier son rendu dans une interface réelle.
Prévisualiser une palette sur les réseaux sociaux
Appliquez vos couleurs à des maquettes de publications et de stories pour vérifier leur rendu avant de préparer vos visuels définitifs.