Farbumwandlung
CMYK profile: Coated FOGRA39 · Die Notation folgt CSS Color 4 und den Kontrastregeln nach WCAG 2.2.
Auf einen Blick
| Name | Dunkles Bernstein |
|---|---|
| Umschrift | Dunkles Bernstein |
| Tradition | digitale Farbe |
| Familie | Gelb |
| HEX | #2F2A13 |
| RGB | rgb(47,42,19) |
| HSL | hsl(49 42% 13%) |
| HSV | hsv(49, 60%, 18%) |
| OKLCH | oklch(0.284 0.038 97.4) |
| LAB | lab(17.02 -1.65 15.77) |
| XYZ | 2,2,1 |
| CMYK | cmyk(0.0% 10.6% 59.6% 81.6%) |
| RAL | #232C3F · Steel blue · RAL 5011 |
Über diese Farbe
Optimismus im Rampenlicht
Dunkles Bernstein liegt bei #2F2A13 und stammt aus der Familie Gelb mit klarer kultureller Herkunft. Allein gelesen wirkt es als Teil dieser Familie; über die Wurzeln in digitale Farbe kommt eine zweite Bedeutungsebene hinzu.
Design-Tipp
Prüfe Dunkles Bernstein (#2F2A13) zuerst auf einer neutralen Fläche; ein Akzent aus der Familie Gelb lässt es bewusst statt dekorativ wirken.
Beste Verwendung
Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
Psychologie
Wahrnehmung
Psychologische Wirkung
Dunkles Bernstein hebt die wahrgenommene Energie einer Gelb-Komposition und lenkt den Blick auf die Handlung.
Emotionale Wirkung
Es wirkt unmittelbar und warm, hebt ein zurückhaltendes Layout, ohne laut zu werden.
Symbolik
Wofür es steht
Kulturelle Bedeutung
Im Kontext von digitale Farbe trägt der Ton eigene Bezüge, prüfe die Symbolik vor der Kampagne.
Positive Assoziationen
Positive Assoziationen neigen zu Hoffnung, Klarheit und spielerische Zuversicht; deshalb erscheint es auf Einladungen und in Saisonarbeiten.
Mit Bedacht einsetzen
Zu viel Fläche liest sich als Angst oder Gefahr bei zu großer Lautstärke, bleib daher bei Akzenten und kleinen Feldern.
Einsatzorte
Typische Designanwendungen
- Kampagnen-Landingpages
- Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
- Redaktionelle Cover-Systeme
- Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
- Produktverpackungs-Etiketten
- Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
- Statusakzente im Dashboard
- Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
- Leitsysteme im Handel
- Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
Designhinweise
So gelingt der Einsatz
Empfohlen
- Gesättigte Flächen unter etwa zwanzig Prozent des Layouts halten.
- Nur für die primäre Handlungsaufforderung verwenden.
- Die Kombination in kleiner Größe auf neutralem Grund prüfen.
Vermeiden
- Nicht neben grelle Neongrün- oder Elektroblautöne setzen.
- Nie für langen Fließtext auf Weiß verwenden.
- Verläufe vermeiden, die den Farbton in eine andere Familie verschieben.
Marken mit Der Unschuldige, Der Entdecker als Grundlage zeigen damit Charakter, bevor sie ein Wort sagen.
Gelb ist der hellste Farbton, den das Auge auflösen kann, und zieht Aufmerksamkeit auf sich, bevor die Form gelesen wird. Blasse Versionen wirken sonnig, gesättigte wie ein Warnschild.
Kombination
Farben, die es ergänzen
Geschichte
Pigmente und Herkunft
Vor synthetischen Farbstoffen wurde Dunkles Bernstein aus Mineral- und Pflanzenpigmenten gemischt; die Familie Gelb hing von Ocker, Krapp und Indigo ab. Bildschirme geben es heute gleichmäßiger wieder als jedes einzelne Pigment.
Schlagwörter
Varianten
Schattierungen werden dunkler, Aufhellungen heller; der Farbwinkel bleibt gleich.
Schattierungen
Dunklere Stufen im selben Farbton.
Aufhellungen
Hellere Stufen für Flächen und Hintergründe.
Anwendungsfälle
- Schattierungen → Hover, Schatten, Tiefe
- Aufhellungen → Highlights, Flächen
- Balance → konsistente Farbsysteme
Gestaltungstipp
Ein Hauptton, ein Begleiter und ein Akzent genügen.
Farbsysteme im Vergleich
Der nächstliegende benannte Farbton in jeder Tradition und jedem Designsystem, gemessen in OKLCH ΔE. Kleiner heißt näher.
Asiatische Farbtraditionen
Designsysteme
Alle anzeigen (11)
RAL Classic
Farbkombinationen
Den Farbkreis drehen und die Helligkeit halten.
So einsetzen
Drei Schritte halten die Farbe lesbar und bewusst.
Warum es wirkt
Die wahrnehmungsbezogene Begründung der Palette.
Komplementär
Gegenüber im Farbkreis; schärft die Fokusfarbe durch Kontrast.
Beste Verwendung: Handlungsaufrufe und Highlights einzelner Funktionen
Split-Komplementär
Zwei Nachbarn des Gegenübers; weicher als ein direkter Komplementärkontrast.
Beste Verwendung: Ausgewogene Marketinglayouts mit zwei Akzenten
Triadisch
Drei gleichmäßig verteilte Töne; lebendig, braucht aber eine dominante Stimme.
Beste Verwendung: Event-Identitäten und verspielte redaktionelle Seiten
Analog
Benachbarte Töne im Kreis; ruhig, zusammenhängend und leicht zu erfassen.
Beste Verwendung: Hintergründe, Diagramme und ruhige Produktseiten
Monochrom
Ein Farbton über Helligkeitsstufen; diszipliniert und hochwertig.
Beste Verwendung: Designsysteme, Verpackungen und typografische Hierarchie
Palette exportieren
CSS
:root {
--color-1: #1C190B;
--color-2: #26220F;
--color-3: #2F2A13;
--color-4: #595542;
--color-5: #827F71;
}
Tailwind
colors: {
color1: '#1C190B',
color2: '#26220F',
color3: '#2F2A13',
color4: '#595542',
color5: '#827F71',
}
JSON
["#1C190B","#26220F","#2F2A13","#595542","#827F71"]
Prinzipien
Balance
Ein Hauptton, ein Begleiter und ein Akzent genügen.
Kontrast
Fließtext vor dem Launch gegen Weiß und Schwarz prüfen.
Harmonie
Den Farbkreis drehen und die Helligkeit halten.
Kontrastprüfung
Fließtext vor dem Launch gegen Weiß und Schwarz prüfen.
Gib Dunkles Bernstein das eine Element, das zuerst auffallen muss; der Rest der Gelb-Palette trägt es.
WCAG-Kontraststandards
WCAG 2.2 legt Mindestkontraste für Text und UI-Teile fest. #2F2A13 erreicht 14.37:1 gegen Weiß (AAA) und 1.31:1 gegen Schwarz (FAIL). Wählen Sie unten den passenden Grenzwert für die Textgröße.
| Stufe | Normaler Text | Großer Text (18pt+ / 14pt fett) | Symbole & UI-Teile |
|---|---|---|---|
| AAA | 7 : 1 | 4.5 : 1 | — |
| AA | 4.5 : 1 | 3 : 1 | 3 : 1 |
| Nicht bestanden | < 4.5 : 1 | < 3 : 1 | < 3 : 1 |
Großer Text bedeutet 18pt normal oder 14pt fett. UI-Teile brauchen 3:1 gegen benachbarte Farben. AA ist die übliche Baseline, AAA die erweiterte Stufe.
Technische Formate
Notation in den Farbräumen
CSS Color 4
sRGB / D65
HSL
perceptual
CIE Lab
CIE LCH
CIE XYZ
CIE LUV
CSS HWB
Praktische Formate
Direkt nutzbare Werte
custom properties
arbitrary value
ARGB
dart:ui
RGB / CMYK
FOGRA39
Farbanalyse
Gemessene Farbwerte
relative luminance · warm
vs white · AAA · warm
vs black · FAIL · warm
saturation 42% · warm
lightness 13% · warm
玄色 #3A3A40 · warm
Farbsimulator
Wirkung bei Farbsehschwäche
Wirkung bei Farbsehschwäche · ΔE 21.1
Kreative Aspekte
Kultur, Stimmung, Geschichte
Gelesen wird es meist als Energie, Wärme, Selbstbewusstsein und ein Hauch von Zeremonie.
Gelesen wird es meist als Energie, Wärme, Selbstbewusstsein und ein Hauch von Zeremonie.
Gelesen wird es meist als Energie, Wärme, Selbstbewusstsein und ein Hauch von Zeremonie.
Gelesen wird es meist als Energie, Wärme, Selbstbewusstsein und ein Hauch von Zeremonie.
Gelesen wird es meist als Energie, Wärme, Selbstbewusstsein und ein Hauch von Zeremonie.