Die Farbe Ocker liegt zwischen Gelb und Braun auf dem Farbkreis. Dieser erdige Ton erinnert an natürliche Pigmente und rustikale Nuancen, wie Gelbocker und bräunliches Gelb. Ideal, um Designs eine geerdete, zeitlose Atmosphäre zu verleihen und eine natürliche, einladende Stimmung zu erzeugen.

Ocker wird durch folgende Farbwerte definiert, um Konsistenz über verschiedene digitale Plattformen und Geräte hinweg zu gewährleisten.
- Hex-Code: #CC7722
- RGB-Wert: 80,0 % Rot, 46,7 % Grün, 13,3 % Blau
Barrierefreiheit spielt eine entscheidende Rolle bei der Farbwahl im UX- und UI-Design. Die Figma-Community bietet Plugins an, mit denen du sicherstellen kannst, dass deine Designs den Web Content Accessibility Guidelines entsprechen.
Für Variationen im gleichen Spektrum wie Ocker, ziehe in Betracht:
- Senfgelb (#ffce1b): Senfgelb teilt den warmen, erdigen Ton mit Ocker und verkörpert die sonnige Tiefe natürlicher Ockerpigmente.
- Safran (#f1c338): Mit seinem würzigen, rustikalen Ton fängt Safran den bräunlich-gelben Geist von Ocker ein und vermittelt eine Aura von Wärme und Tradition.
- Gold (#efbf04): Gold bietet eine glänzende Version der erdigen Töne von Ocker, mit einem ähnlichen warmen Ton, aber mit einem metallischen Glanz, der Helligkeit suggeriert.
- Dunkelgelb (#ba8e23): Dunkelgelb bringt einen tieferen, gedämpfteren Ansatz zum Gelbocker, der das gealterte, organische Gefühl von Ton und erdigen Tönen widerspiegelt.
Um Ocker zu ergänzen, kombiniere es mit:
- Waldgrün (#2E6F40): Dieser satte, erdige Ton bietet einen auffälligen Kontrast zur Wärme von Ocker und schafft eine ausgewogene, naturinspirierte Palette.
- Burgunderrot (#660033): Der tiefe, raffinierte Ton von Burgunderrot verstärkt Ocker und sorgt für einen luxuriösen und einladenden Look, der sowohl kühn als auch geerdet wirkt.
- Schieferblau (#557C99): Ocker harmoniert wunderbar mit Schieferblau, wobei die Kühle des Blaus die warmen, erdigen Töne von Ocker ausgleicht, was an klassische Kunstpaletten erinnert.
- Creme (#FDFBD4): Dieser weiche, neutrale Farbton bietet einen sanften, unaufdringlichen Hintergrund, der die bräunlich-gelbe Lebendigkeit und Wärme von Ocker hervorhebt.
- Olivgrün (#636B2F): Indem es die natürlichen Pigmente von Ocker widerspiegelt, schafft Olivgrün eine erdige, harmonische Palette, ideal für inspirierte Künstlerprojekte.
Während Ocker ein erdiger, warmer Ton ist, kann es mit folgenden Farben im Kontrast stehen:
- Leuchtend Gelb (#FFED29): Die hohe Intensität von leuchtendem Gelb kann die subtileren, bräunlich-gelben Töne von Ocker überstrahlen.
- Neonpink (#FF13F0): Die Lebhaftigkeit von Neonpink kann visuell störend gegen Ocker wirken und eine kohärente Künstlerpalette unterbrechen.
- Blutorange (#FF4B33): Blutorange, mit seinen kräftigen rostigen Schattierungen, kann einen unausgewogenen Kontrast zu den weicheren Untertönen von Ocker schaffen.
- Chartreuse (#CCFF00): Die elektrische Qualität von Chartreuse kann die natürliche Wärme von Ocker überschatten und zu Spannungen in Farbkreisarrangements führen.
- Himmelblau (#82C8E5): Himmelblau, als kühlerer Farbton, kann von den warmen, erdigen Tönen von Ocker ablenken und eine unharmonische Stimmung erzeugen.
Farbvarianten
Schattierungen
Tönungen
Töne
Farbtöne
Farbharmonien
Komplementär
Gespalten
Monochromatisch
Analog
Triadisch
Quadratisch
Eigene Paletten
Gewürztes Azur
Wüstenhimmel
Lebendige Glut
Kontrastprüfer
Kontrast 3,37
- Großer Text
#CC7722
- Normaler Text
Dein Design, deine Ausrichtung und dein Aufbau zählen. Figma ist für dich da.
| Kategorie | ||
|---|---|---|
Fehlgeschlagen | Fehlgeschlagen | |
Bestanden | Fehlgeschlagen | |
Bestanden | Fehlgeschlagen |
Kontrast 6,23
- Großer Text
#CC7722
- Normaler Text
Dein Design, deine Ausrichtung und dein Aufbau zählen. Figma ist für dich da.
| Kategorie | ||
|---|---|---|
Bestanden | Fehlgeschlagen | |
Bestanden | Bestanden | |
Bestanden | Bestanden |
Farbsimulationen
Protanopie
Deuteranopie
Tritanopie
Achromatopsie
Die hexadezimale Farbe #CC7722, bekannt als Ocker, hat die RGB-Werte R:204, G:119, B:34 und die CMYK-Werte C:0, M:42, Y:83, K:20.
| VALUE | CSS | |
|---|---|---|
| HEX | #CC7722 | #CC7722 |
| RGB DECIMAL | 204, 119, 34 | RGB(204,119,34) |
| RGB PERCENTAGE | 80.0, 46.7, 13.3 | RGB(80.0%,46.7%,13.3%) |
| CMYK | 0, 42, 83, 20 | |
| HSL | HSL(30.0, 71.4%, 46.7%) | HSL(30.0, 71.4%, 46.7%) |
| HSV (OR HSB) | 30.0°, 83.3, 80.0 | |
| WEB SAFE | #20410251 | #20410251 |
| BINARY | 11001100, 01110111, 00100010 | |
| iOS - SwiftUI | Color(red: 0.800, green: 0.467, blue: 0.133) | |
| iOS - UIKit | UIColor(red: 0.800, green: 0.467, blue: 0.133, alpha: 1) | |
| Android - Compose | Color(0xFFCC7722) |


