colorize
ColorKit
CK
colorizeFARBWÄHLER

Farbe wählen.
Alles darüber erfahren.

Wählen Sie eine Farbe oder geben Sie einen HEX-Code ein, um Schattierungen, Harmonien, CSS-Werte und Kontraste sofort zu analysieren.

palette
Intelligenter InspektorUniverselle Farb-SuitePräzision 0.01% ΔE
Ihr professioneller Farb-Baukasten
#3B82F6• Drag to pick
Klicken & Ziehen im FarbfeldsRGB • 0.01% ΔE
Farbspektrum217°
Transparenz (Alpha)100%
HEX
#3B82F6
RGB
59 130 246
HSL
217° 91% 60%
HSV
217° 76% 96%
CMYK
76% 47% 0% 4%

Shades

7 Steps

Darker variations of your color.

#3B82F6#102343

Tints

7 Steps

Lighter variations of your color.

#3B82F6#FFFFFF

Color Palette

Harmonious

Harmonious color combinations.

Click any swatch to inspect

Gradient

CSS 90deg

Create beautiful gradients.

#3B82F6 → #EC4899
Wissensdatenbank & FAQ

Häufig gestellte Fragen

Direkte Antworten und Lösungen zu häufigen Fragen, technischen Herausforderungen und Webstandards.

Warum weichen Farben in CSS von Figma, Photoshop oder Canva ab?expand_more
Diese Abweichung wird häufig durch Farbraum-Unterschiede verursacht. Webbrowser rendern CSS-Hex-Codes im Standard-Farbraum sRGB. Neuere Monitore und Design-Programme wie Photoshop oder Figma nutzen jedoch standardmäßig Display P3 oder Adobe RGB mit einem größeren Farbumfang. Beim unkonvertierten Exportieren nach sRGB können kräftige Farbtöne matt wirken. Stellen Sie das Farbprofil in Ihrem Design-Tool vor dem Export auf sRGB ein oder nutzen Sie CSS Color 4 mit color(display-p3 0.9 0.2 0.5).
Wie prüfe ich, ob meine Webfarben den WCAG- und Barrierefreiheitsstandards entsprechen?expand_more
Gemäß den Richtlinien WCAG 2.1 muss ein Mindestkontrastverhältnis erreicht werden: 4,5:1 für normalen Text (unter 18pt oder 14pt fett) und 3,0:1 für großen Text sowie interaktive UI-Elemente wie Schaltflächenrahmen. Testen Sie beliebige Farbkombinationen mit unserem kostenlosen WCAG-Kontrastprüfer.
Was ist das OKLCH-Farbmodell und warum setzen moderne Entwickler darauf?expand_more
OKLCH ist ein wahrnehmungsbezogen gleichförmiger Farbraum aus CSS Color 4. Klassische Modelle wie HSL täuschen das menschliche Auge: Reines Gelb wirkt bei 50 % Helligkeit wesentlich heller als reines Blau mit denselben 50 %. OKLCH passt die Helligkeit (L) exakt an die menschliche Wahrnehmung an, wodurch Grauzonen in Farbverläufen vermieden werden.
Ist ColorKit für kommerzielle Kundenprojekte kostenlos nutzbar?expand_more
Ja, zu 100 % kostenlos. Alle erstellten Farbpaletten, Konvertierungscodes, CSS-Verläufe, Tailwind-Skalen und Bildfarben sind gemeinfrei (CC0). Sie dürfen ohne Lizenzgebühren und ohne Namensnennung in kommerziellen Webseiten, Apps und Firmenprojekten verwendet werden.
Werden hochgeladene Bilder oder Farbcodes auf externe Server übertragen?expand_more
Nein. ColorKit basiert auf einer strikten 100 % Client-Side Privacy-Architektur. Sämtliche Berechnungen, Farblupen und Bildanalysen finden ausschließlich lokal im Arbeitsspeicher Ihres Browsers (HTML5 Canvas) statt. Ihre Entwürfe verlassen Ihr Gerät niemals.