Farbwähler
Wählen Sie eine Farbe aus einem hochgeladenen Bild, vom Bildschirm mit dem EyeDropper, mit dem nativen Farbwähler, RGB/HSL-Schiebereglern oder durch Einfügen eines Hex-Werts. Sehen Sie HEX, RGB, RGBA, HSL, HSLA, HSV, CMYK und OKLCH auf einen Blick, plus den nächstgelegenen CSS-Farbnamen, Kontrast zu Schwarz/Weiß und vollständige Harmonie-Paletten.
Bilder und Farbwerte werden in Ihrem Browser verarbeitet. Nichts wird an einen Server hochgeladen.
So verwenden Sie diesen farbwähler
- Wählen Sie eine Farbe mit dem nativen Farbwähler, fügen Sie einen Hex-Wert ein oder verwenden Sie die RGB/HSL-Schieberegler.
- Laden Sie ein Bild hoch, ziehen Sie es per Drag-and-Drop oder fügen Sie es ein — klicken Sie dann auf ein Pixel, um dessen Farbe zu erfassen.
- In unterstützten Browsern klicken Sie 'Vom Bildschirm wählen', um die EyeDropper-API zu verwenden.
- Klicken Sie auf einen beliebigen Wert (HEX, RGB, HSL, HSV, CMYK, OKLCH), um ihn zu kopieren.
- Durchsuchen Sie Aufhellungen, Abdunklungen, monochromatische, komplementäre, analoge, triadische, tetradische und geteilt-komplementäre Paletten.
- Speichern Sie Farben in Zuletzt verwendet — sie bleiben in Ihrem Browser über localStorage erhalten.
Häufig gestellte Fragen
Kann ich eine Farbe aus einem Bild wählen?
Ja. Laden Sie ein Bild hoch, ziehen Sie es per Drag-and-Drop oder fügen Sie es aus der Zwischenablage ein. Bewegen Sie den Cursor, um die Pixelfarbe in der Vorschau zu sehen, und klicken oder tippen Sie dann, um sie auszuwählen. Alles bleibt in Ihrem Browser.
Was ist OKLCH und warum verwenden?
OKLCH ist ein perzeptiver Farbraum (Lightness, Chroma, Hue), der gleichmäßigere Farbschritte als HSL liefert. CSS unterstützt ihn seit 2023 nativ als `oklch()`.
Funktioniert der EyeDropper in allen Browsern?
Er funktioniert in Chromium-basierten Browsern (Chrome, Edge, Opera) auf dem Desktop. Die Schaltfläche erscheint nur, wenn unterstützt.
Wie genau ist CMYK hier?
Es ist eine Bildschirm-Annäherung (kein ICC-Profil). Für Druckarbeiten verwenden Sie immer ein echtes CMYK-Profil in Ihrer Design-App.
Warum stimmt die Farbe, die ich mit EyeDropper vom Bildschirm wähle, nicht mit meinem CSS überein?
EyeDropper liest das gerenderte Pixel — was dein Monitor nach Farbverwaltung tatsächlich anzeigt. Auf einem P3-Wide-Gamut-Display unterscheidet sich das leicht vom sRGB-Hex in deinem Stylesheet. Für brand-exaktes CSS picke direkt aus der Designquelle (Figma, Originalasset) statt vom gerenderten Bildschirm.