:root {
--color-100: #d0d9fb;
--color-200: #8aa0f4;
--color-300: #4466ee;
--color-400: #4466ee;
--color-500: #0f2da3;
--color-600: #0a1c67;
--color-700: #050f38;
}Le générateur de palettes de couleurs transforme une couleur de base unique en un ensemble de couleurs coordonné à l'aide des règles d'harmonie des roues de couleur. Choisissez une couleur de départ et choisissez un mode — nuances et teintes, monochromatiques, complémentaires, analogues, triadiques ou tétradices — et l'outil calcule une palette équilibrée avec la valeur Hex, RGB et HSL pour chaque échantillon.
De bonnes combinaisons de couleurs suivent des relations prévisibles sur la roue de couleur HSL : les couleurs complémentaires sont placées l'une à l'autre, les couleurs analogues sont s'assouplissantes les unes des autres et les couleurs triadiques sont régulièrement espacées. Les travailler à la main signifie jongler avec les angles de teinte et les valeurs de luminosité. Cet outil effectue les calculs instantanément et affiche le résultat afin que vous puissiez choisir un schéma qui fonctionne.
Tout fonctionne dans votre navigateur. Ajustez la couleur de base, changez de mode, cliquez sur n'importe quel nuancier pour copier sa valeur ou exportez toute la palette en tant que propriétés personnalisées CSS. Aucun compte, aucun téléchargement, et il continue de fonctionner hors connexion une fois la page chargée.
Utilisez le sélecteur de couleurs ou saisissez une valeur hexadécimale pour définir la couleur autour de laquelle votre palette est construite.
Basculez entre les nuances et les teintes, monochromatiques, complémentaires, analogues, triadiques et tétradic pour voir différents schémas coordonnés.
Chaque nuancier affiche sa valeur HEX, RGB et HSL. Cliquez sur un échantillon pour le copier ou copiez la palette entière en tant que propriétés personnalisées CSS.
Utilisez les couleurs générées pour les arrière-plans, les accents et le texte de votre conception ou de votre feuille de style, en gardant l'harmonie cohérente dans votre interface utilisateur.
Les nuances et les teintes, monochromes, complémentaires, analogues, triadiques et tétradics couvrent toutes les relations de couleurs courantes
Chaque nuance affiche les trois formats, afin que vous puissiez déposer la bonne valeur directement dans CSS, outils de conception ou code
Exportez la palette entière en tant que : Propriétés personnalisées de racine, prêtes à coller dans votre feuille de style en tant que jeton de conception
Les harmonies sont calculées en HSL afin que les teintes restent uniformément espacées et que les pas de légèreté semblent équilibrés, pas boueux.
Pick colors and convert between HEX, RGB, and HSL formats
Check the contrast ratio between a text color and its background against WCAG 2.2 AA and AAA thresholds, with a live preview and one-click accessible-color suggestions.
Create beautiful CSS gradients with live preview
0 comments
No comments yet. Be the first to share your thoughts!