:root {
--color-100: #d0d9fb;
--color-200: #8aa0f4;
--color-300: #4466ee;
--color-400: #4466ee;
--color-500: #0f2da3;
--color-600: #0a1c67;
--color-700: #050f38;
}Quel est le générateur de palettes de couleurs ?
Le générateur de palette de couleurs transforme une seule couleur de base en un ensemble coordonné de couleurs à 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étradiques - et l'outil calcule une palette équilibrée avec la valeur HEX, RVB 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.
Les modes d'harmonie proviennent des relations couleur-roue, la teinte tournante par des montants fixes autour du cercle : 180 degrés pour complémentaire, 120 pour triadique, et de petits pas pour analogue Que les maths sont faites en HSL, ce qui est pratique et pas uniforme perceptuellement La légèreté HSL traite le jaune et le bleu à la même valeur que la lumière égale, et à l'œil qu'ils ne sont pas, c'est pourquoi un ensemble triadique peut paraître équilibré sur papier et déséquilibré à l'écran Vérifiez toute palette que vous prévoyez d'utiliser pour le texte contre un vérificateur de contraste plutôt que de faire confiance aux nombres Les nuances et les teintes sont produites en déplaçant la légèreté tout en maintenant la teinte et la saturation, ce qui garde une famille rend un ensemble reconnaissable comme étant lié et les variables CSS.
Comment utiliser le générateur de palettes de couleurs ?
Choisissez une couleur de base
Utilisez le sélecteur de couleurs ou saisissez une valeur hexadécimale pour définir la couleur autour de laquelle votre palette est construite.
Choisissez un mode d'harmonie
Basculez entre les nuances et les teintes, monochromatiques, complémentaires, analogues, triadiques et tétradic pour voir différents schémas coordonnés.
Copiez les couleurs dont vous avez besoin
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.
Appliquer la palette
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.
Principales caractéristiques
Six modes d'harmonie
Les nuances et les teintes, monochromes, complémentaires, analogues, triadiques et tétradics couvrent toutes les relations de couleurs courantes
Hex, RGB et HSL
Chaque nuance affiche les trois formats, afin que vous puissiez déposer la bonne valeur directement dans CSS, outils de conception ou code
Exportation des variables CSS
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
Maths de la roue de couleur précise
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.
Frequently Asked Questions
Related Tools
Color Contrast Checker
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.
Color Mixer
Blend two colors with adjustable ratio and blend modes, and build a gradient between them
Color Picker & Converter
Pick colors and convert between HEX, RGB, and HSL formats
Color Shades Generator
Generate tints, shades, and tones from any base color
Comments
0 comments
No comments yet. Be the first to share your thoughts!