Farben umrechnen: HEX ↔ RGB

Was sind HEX-Farben?

HEX-Farben sind hexadezimale Codes, zwei Stellen pro Farbkanal (Rot, Grün, Blau). Beispiel: #4CAF50. RGB schreibt die drei Werte als Dezimalzahlen: rgb(76, 175, 80).

Genau & einfach: Schritt-für-Schritt Anleitungen

1) HEX → RGB — Schritt für Schritt

  1. Entferne führendes # (z. B. #4CAF50 → 4CAF50).
  2. Teile den 6-stelligen String in drei Paare: 4C / AF / 50.
  3. Wandle jedes Paar von Hex nach Dezimal: rechne erste Ziffer × 16 + zweite Ziffer. Beispiel: 4C = 4×16 = 64 + 12 = 76.
  4. Ergebnis: rgb(76, 175, 80).

Tipp: Hex-Ziffern: a=10, b=11, c=12, d=13, e=14, f=15. Für AF: A=10 → 10×16 + 15 = 175.

2) RGB → HEX — Schritt für Schritt

  1. Beginne mit drei Dezimalwerten zwischen 0 und 255, z. B. 76, 175, 80.
  2. Wandle jede Dezimalzahl nach Hexadezimal um: rechne (Zahl ÷ 16 für die erste Ziffer, Rest für die zweite) oder benutze einen Taschenrechner. Beispiel: 76 → 4C.
  3. Wenn eine Hex-Zahl nur eine Stelle hat (z. B. 10 → a), füge eine führende Null hinzu: 0a.
  4. Setze die drei Hex-Paare zusammen und setze ein # davor → #4caf50 (Kleinschreibung ist ok).

Kurz: n → n.toString(16).padStart(2,'0') (für Entwickler). Fürs Kopf-Rechnen: 175 ÷ 16 = 10 Rest 15 → AF.

3) HEX (Kurzform, 3 Zeichen) → RGB — Schritt für Schritt

  1. Entferne # (z. B. #f0a → f0a).
  2. Verdopple jede Ziffer: f→ff, 0→00, a→aa.
  3. Wandle jede Zweiergruppe nach Dezimal um (wie bei Punkt 1). Beispiel: ff=255, aa=170.
  4. Ergebnis: rgb(255, 0, 170).

Schnelltrick: statt zu verdoppeln kannst du auch die einzelne Hex-Ziffer mit 17 multiplizieren: z = hexDigit (0–15) → Dezimal = z × 17. Beispiel: a (10) → 10×17 = 170.

4) RGB → HEX (Kurzform, 3 Zeichen) — Schritt für Schritt

  1. Prüfe, ob jeder RGB-Wert ein Vielfaches von 17 ist (0, 17, 34, …, 255). Nur dann ist Kurzform exakt möglich.
  2. Teile jeden Wert durch 17 → ergibt eine Zahl 0–15 (z. B. 204 ÷ 17 = 12).
  3. Wandle diese Zahl in eine einzelne Hex-Ziffer um (0–9, a–f).
  4. Setze die drei Ziffern zusammen mit # → z. B. #fcf.

Wichtig: Wenn eine Komponente nicht durch 17 teilbar ist, gibt es keine exakte 3-stellige Kurzform — dann ist nur die 6-stellige Variante korrekt.