Alle Tools

Farb-Konverter

Konvertieren Sie Farben zwischen HEX, RGB und HSL. Perfekt für Webdesigner, Grafiker und Entwickler. Mit Farbvorschau und praktischen Kopierfunktionen.

Farb-Konverter

Farbvorschau

Farbpalette

Rot-Wert

59 / 255 (23%)

Grün-Wert

130 / 255 (51%)

Blau-Wert

246 / 255 (96%)

Farbformat-Guide

HEX

Hexadezimal-Format für Web und CSS. Format: #RRGGBB

RGB

Rot-Grün-Blau Werte von 0-255. Format: rgb(r, g, b)

HSL

Farbton-Sättigung-Helligkeit. Format: hsl(h, s%, l%)

Beliebte Farben

Rot: #FF0000
Blau: #0000FF
Grün: #00FF00
Gelb: #FFFF00
Lila: #800080
Orange: #FFA500

🎨 Alles über Farbformate und Umrechnung

Farbformat-Details:

  1. 1
    HEX (#RRGGBB): Hexadezimal (0-9, A-F)
    #FF0000 = Rot (255, 0, 0)
    Wird in CSS, HTML, Design-Software verwendet
  2. 2
    RGB (Red, Green, Blue): 0-255 pro Kanal
    rgb(255, 0, 0) = Reines Rot
    Additive Farbmischung (Bildschirme)
  3. 3
    HSL (Hue, Saturation, Lightness):
    H: 0-360° (Farbton), S: 0-100% (Sättigung), L: 0-100% (Helligkeit)
    Intuitivere Farbwahl für Designer

Umrechnungsformeln:

HEX zu RGB:
R = parseInt(hex.substring(1,3), 16)
G = parseInt(hex.substring(3,5), 16)
B = parseInt(hex.substring(5,7), 16)
RGB zu HEX:
hex = "#" + R.toString(16) + G.toString(16) + B.toString(16)
RGB zu HSL:
Komplexere Formel mit Min/Max-Berechnungen
Unser Konverter übernimmt das automatisch!

❓ Häufig gestellte Fragen zu Farben im Design

Welches Farbformat sollte ich verwenden?

Web/CSS: HEX (#FF0000) oder RGB
Design: HSL für intuitive Anpassungen
Print: CMYK (nicht hier verfügbar)
App-Entwicklung: RGB oder native Formate

Was sind websichere Farben?

Historisches Konzept aus den 90ern. Moderne Browser zeigen alle 16,7 Millionen Farben korrekt an. Heute wichtiger: Kontrast für Barrierefreiheit (WCAG-Standards).

Wie finde ich passende Farbkombinationen?

Farbtheorie: Komplementärfarben (gegenüber im Farbkreis), Analoge Farben (benachbart), Triadische Farben (gleichmäßig verteilt). Tools: Adobe Color, Coolors.co

Was bedeuten die HSL-Werte genau?

Hue (0-360°): Farbton im Farbkreis (0°=Rot, 120°=Grün, 240°=Blau)
Saturation (0-100%): Farbintensität (0%=Grau, 100%=rein)
Lightness (0-100%): Helligkeit (0%=schwarz, 50%=rein, 100%=weiß)

Warum sehen Farben auf verschiedenen Geräten anders aus?

Unterschiedliche Display-Technologien (LCD, OLED), Farbräume (sRGB, Adobe RGB), Kalibrierung und Umgebungslicht beeinflussen die Farbwiedergabe.

Was ist der Unterschied zwischen RGB und CMYK?

RGB: Lichtfarben (Bildschirm) - additive Mischung
CMYK: Druckfarben (Papier) - subtraktive Mischung
RGB-Farben wirken oft heller/gesättigter als CMYK-Druck.

📊 Praktische Farbbeispiele für Designer

🎨 Brand Colors

Twitter: #1DA1F2
Facebook: #4267B2
YouTube: #FF0000
WhatsApp: #25D366
Marken-Konsistenz ist entscheidend!

🌐 Web Standards

Text: #000000
Hintergrund: #FFFFFF
Links: #007BFF
Erfolg: #28A745
Fehler: #DC3545
Bootstrap/Material Design Standards

🎯 Accessibility

Kontrastrichtlinien (WCAG):
• Normal: 4,5:1 Minimum
• Groß: 3:1 Minimum
• AA Standard: 7:1 besser
Text: #212529
Sekundär: #6C757D
Immer Kontrast-Checker verwenden!

🌈 Farbpsychologie im Design

Rot
Energie, Aufmerksamkeit
Blau
Vertrauen, Ruhe
Grün
Natur, Wachstum
Gelb
Optimismus, Kreativität
Lila
Luxus, Kreativität
Orange
Begeisterung, Wärme