Farbkonvertierung
#d1d4d7
Variationen
Ziel dieses Abschnitts ist es, Töne (reines Weiß hinzugefügt) und Schattierungen (reines Schwarz hinzugefügt) deiner ausgewählten Farbe in 10%-Schritten genau zu erzeugen.
Profi-Tipp: Verwende Schattierungen für Hover-Zustände und Schatten, Töne für Highlights und Hintergründe.
Schattierungen
Dunklere Variationen, die durch Hinzufügen von Schwarz zu deiner Basisfarbe erstellt werden.
Töne
Hellere Variationen, die durch Hinzufügen von Weiß zu deiner Basisfarbe erstellt werden.
Häufige Anwendungsfälle
- • UI-Komponenten-Zustände (Hover, aktiv, deaktiviert)
- • Tiefe mit Schatten und Highlights erzeugen
- • Konsistente Farbsysteme aufbauen
Designsystem-Tipp
Diese Variationen bilden die Grundlage einer kohärenten Farbpalette. Exportiere sie, um Konsistenz in deinem gesamten Projekt zu gewährleisten.
Farbkombinationen
Jede Harmonie hat ihre eigene Stimmung. Verwende Harmonien, um Farbkombinationen zu brainstormen, die gut zusammenpassen.
So verwendest du es
Klicke auf eine beliebige Farbe, um ihren Hex-Wert zu kopieren. Diese Kombinationen sind mathematisch bewiesen, um visuelle Harmonie zu schaffen.
Warum es wichtig ist
Farbharmonien schaffen Balance und rufen spezifische Emotionen in deinen Designs hervor.
Komplementär
Eine Farbe und ihr Gegenüber auf dem Farbkreis, +180 Grad Farbton. Hoher Kontrast.
Gesplittet-komplementär
Eine Farbe und zwei angrenzende zu ihrem Komplementär, +/-30 Grad Farbton vom Wert gegenüber der Hauptfarbe. Kühn wie ein direktes Komplementär, aber vielseitiger.
Triadisch
Drei Farben gleichmäßig entlang des Farbkreises verteilt, jeweils 120 Grad Farbton auseinander. Am besten eine Farbe dominieren lassen und die anderen als Akzente verwenden.
Analog
Drei Farben mit gleicher Leuchtkraft und Sättigung, deren Farbtöne auf dem Farbkreis benachbart sind, 30 Grad auseinander. Sanfte Übergänge.
Monochromatisch
Drei Farben mit demselben Farbton und Leuchtkraftwerten von +/-50%. Subtil und raffiniert.
Tetradisch
Zwei Sätze von Komplementärfarben, getrennt durch 60 Grad Farbton.
Grundlagen der Farbtheorie
Balance
Verwende eine dominante Farbe, unterstütze mit sekundären und setze Akzente sparsam.
Kontrast
Sorge für ausreichenden Kontrast für Lesbarkeit und Zugänglichkeit.
Harmonie
Farben sollten zusammenarbeiten, um ein einheitliches visuelles Erlebnis zu schaffen.
Farbkontrastprüfer
Teste Farbkombinationen, um sicherzustellen, dass sie den WCAG-Zugänglichkeitsstandards für Textlesbarkeit entsprechen.
Textfarbe
Hintergrundfarbe
Kontrast
WCAG-Standards
Erweiterter Kontrastprüfer
Feinabstimmung mit Schiebereglern, mehreren Vorschauen & mehr
Jeder ist ein Genie. Aber wenn du einen Fisch danach beurteilst, ob er auf einen Baum klettern kann, wird er sein ganzes Leben glauben, dass er dumm ist.
Technische Formate
Praktische Formate
Farbanalyse
Blindheitssimulator
Kreative Aspekte
Häufig gestellte Fragen
- Welche Farbe ist #D1D4D7?
- #D1D4D7 ist Nordischer Nebel – Ein kühles, sehr helles Blaugrau mit subtiler Silbernote, das wie mattes Tageslicht auf Beton wirkt. Es vermittelt eine zurückhaltende, präzise Gelassenheit mit leichter Klarheit.
- Was symbolisiert Nordischer Nebel?
- Neutralität und Objektivität, Zuversicht in Zurückhaltung, Moderner Minimalismus, Verlässlichkeit ohne Dominanz, Kühle Eleganz. In skandinavischen Kontexten steht dieser Ton für funktionalen Minimalismus und Ruhe. In westlichen Geschäftsumgebungen signalisiert er Seriosität und technische Sauberkeit. In Japan harmoniert eine ähnliche Nuance mit ästhetischen Konzepten wie Wabi‑Sabi, wo reduzierte Töne Wertschätzung und Zurückhaltung ausdrücken.
- Wo wird Nordischer Nebel im Design eingesetzt?
- In Räumen und Interfaces beruhigt diese Nuance das Blickfeld und reduziert visuelle Ablenkung. Sie schafft Klarheit ohne Strenge und lässt Akzentfarben stärker hervortreten.
- Welche Farben passen gut zu Nordischer Nebel?
- Nordischer Nebel harmoniert gut mit #C38F5A, #AFCBDA, #2F3A4A. #C38F5A: Warmer Bernsteinakzent als komplementärer/split-komplementärer Kontrast: belebt das kühle Grau und schafft visuelle Hierarchie.. #AFCBDA: Analoges, weiches Blau für sanfte Tiefe und monochromatische Harmonie; ergibt einen beruhigenden, zusammenhängenden Look.. #2F3A4A: Dunkler Schiefer als starker Anker für Typografie und Icons; verbessert Lesbarkeit und bildet klassischen kühlen Kontrast..
- Wie beeinflusst Nordischer Nebel die Stimmung?
- Ruhige Sachlichkeit mit kühler Eleganz Zuschauer fühlen sich gelassen und konzentriert, eher sachlich als emotional aufgeladen. Wichtige Eigenschaften: Verlässlichkeit, Kühle Professionalität, Zurückhaltung, Ordnung, Neutralität.
- Welche Branchen verwenden Nordischer Nebel?
- Nordischer Nebel wird häufig in den Bereichen Technologie (B2B SaaS), Gesundheitswesen (klinische Interfaces), Finanzdienstleistungen (digitale Plattformen) verwendet. Es passt zu Markenarchetypen wie Der Weise, Der Fürsorgliche.
- Was ist die Geschichte von Nordischer Nebel?
- Dieser kühle, helle Blaugrau-Ton hat keine einzelne historische Ersterscheinung; ähnliche Nuancen fanden sich jedoch seit dem 18. Jahrhundert in europäischen Interieurs und Textilien, erzeugt durch stark aufgehellte Blei- oder Zinkweiße mit kleinen Anteilen blauer Pigmente wie Azurit oder ultramarinfarbigen Farbresten. In frühen Industriestädten wurde ein vergleichbarer Grauton an Fabrikfenstern und Metalloberflächen als «funktionale Neutralität» genutzt.
- Wie verwendet man Nordischer Nebel im Design?
- Sichere immer ausreichenden Kontrast (WCAG) und kombiniere kühle Grautöne mit mindestens einem warmen oder dunklen Anker. Best Practices: Nutze #D1D4D7 als großzügigen Hintergrund und setze dunkle Akzente (z. B. 2F3A4A) für Hierarchie und Lesbarkeit.; Paaren mit einem warmen Akzentton (z. B. C38F5A) für Call-to-Action-Elemente, um Aufmerksamkeit ohne aggressive Farbkontraste zu erzeugen.; Arbeite mit Glas, gebürstetem Metall oder hellem Holz, um die kühle Note zu erden und taktile Wärme hinzuzufügen..
- Ist Nordischer Nebel barrierefrei?
- Kontrastverhältnis auf Weiß: 1.49:1, auf Schwarz: 14.11:1. Erfüllt WCAG AA für normalen und großen Text.