Un coup d'œil à l'intérieur
Cet aperçu sécurisé montre à quoi sert l'outil, sans exécuter d'actions liées à un compte.
Ce que sait faire Farbwerkzeug - Outil de couleurs
Colors live in many notations. The designer sends you a HEX, the stylesheet wants RGB, the print shop asks for CMYK and the animation needs HSL because you can rotate the hue so nicely there. The color tool keeps all four representations in sync: change one and the others follow live. It also understands the 140 named CSS colors, so you can just type "rebeccapurple" or "tomato".
From a single base color the tool builds ready-made harmonies. Complementary, analogous, triadic, split-complementary, tetradic or monochromatic - each palette follows the classic rules of color theory and hands you several coordinated shades that work together. Ideal for a brand, a website or a chart where the colors should not clash.
The contrast checker computes the contrast ratio of two colors and tells you straight away whether it reaches the WCAG AA and AAA levels for normal and large text. Accessibility is not a nice-to-have but a legal requirement for many sites - here you see at a glance whether your text stays readable on its background.
The color-blindness simulation is the honest reality check. Roughly one in twelve men sees colors differently. The tool shows your colors as they arrive under protanopia, deuteranopia, tritanopia or full color blindness. That way you notice early if your red-green status indicator becomes indistinguishable for some of your users.
There is also a gradient generator for linear and radial gradients with multiple stops, an eyedropper to pick a color off the screen (where the browser supports it) and the option to pull colors from an uploaded image. You can name your own palettes and save them locally.
Everything runs in the browser, no account and no image or color value ever travelling to a server. Your drafts stay yours. Results copy with one click, whether you need the HEX code, the CSS gradient rule or the whole palette.
Fonctions
HEX, RGB, HSL and CMYK
All four formats live in sync. Change one and the others update instantly. CSS color names too.
Harmonious palettes
Complementary, analogous, triadic, tetradic and monochromatic from one base color per color theory.
Vérification du contraste WCAG
Contrast ratio of two colors with AA and AAA ratings for normal and large text.
Simulate color blindness
See your colors under protanopia, deuteranopia, tritanopia and achromatopsia - the honest check.
Build gradients
Linear and radial gradients with multiple stops, output as a copy-ready CSS rule.
Eyedropper and image colors
Pick a color off the screen or pull the dominant tones from an uploaded image.
Fonctionne en local, sans compte
No image and no color value leaves your device. Save your own palettes locally in the browser.
Comment ça marche
- 1
Pick a base color
Choose a color in the picker, enter a HEX code or type a CSS color name.
- 2
Choisir l'onglet
Convert, palette, gradient, contrast or color blindness - depending on what you need.
- 3
Adjust and check
Switch the palette type, set a second color for contrast, or click through the simulation.
- 4
Copy or save
Copy a HEX, a CSS rule or the whole palette and save named palettes for later.
Pour qui
Questions fréquentes
What does the WCAG contrast ratio mean?
It describes the brightness difference between two colors. For normal text WCAG requires at least 4.5:1 (level AA) or 7:1 (AAA); for large text 3:1 or 4.5:1 suffices. The tool shows you which level your combination reaches.
What is the color-blindness simulation for?
About 8% of men and 0.5% of women perceive certain colors differently. The simulation shows how your colors arrive under the most common forms, so important distinctions - like red and green in a status - stay recognisable for everyone.
Why does my CMYK differ from the print?
The conversion is a mathematical approximation without a color profile. The actual print depends on paper, press and ICC profile. Use the CMYK values as a guide, but always get a proof for color-critical production.
Can I enter CSS color names?
Yes. All 140 named CSS colors are recognised, from "aliceblue" to "yellowgreen". Type the name and the tool shows you the matching HEX, RGB, HSL and CMYK values.
Mes images sont-elles envoyées sur un serveur ?
No. When you pull colors from an image, the image is processed purely locally in your browser. It never leaves your device and is not stored.
Outils similaires
CSS-Kontrast-Checker - Vérification du contraste CSS
Prüfe Farbkontraste nach WCAG 2.1 AA/AAA und APCA. Farbenblindheits-Simulation, Vorschläge, P…
Farbpaletten-Extraktor - Extrait la palette de couleurs
Extrahiere dominante Farben aus Bildern. HEX, RGB, HSL, OKLCH kopieren. Export als CSS, Tailw…
SVG-Umfärber - Change les couleurs des icônes SVG
Fill- und Stroke-Farben in SVG-Icons austauschen. Vorschau, Farbpaletten-Presets, Batch-Verar…
Favicon Generator - Générateur de favicon
Erstelle ein komplettes Favicon-Set mit ICO, Apple Touch Icon, Android Chrome, PWA-Manifest u…
Bild-Konverter - Convertisseur d'images
Wandle Bilder zwischen JPG, PNG, WebP, AVIF, GIF und BMP um. Batch-Konvertierung mit Qualität…
Barrierefreiheit - Accessibilité
Passe Werkzeu.ge an deine Bedürfnisse an: Textgröße, Kontrast, Animationen und Legasthenie-Sc…
Prêt pour Farbwerkzeug - Outil de couleurs ?
Sans installation. Inclus à partir de Plus. S’ouvre directement dans le navigateur.
Ouvrir maintenant