LBM · Redesign-Richtung

Weiss trägt, Mint akzentuiert

Weiss trägt die Fläche, Struktur entsteht aus Linien, Abstand und Typografie. Petrol ist die Ink-Farbe, Mint der grosszügige Akzent — als Fläche und, im dunkleren Ton, als Text. Dunkle Töne (Navy, Hellblau) bleiben ein kleiner Akzent — Punkt, Linie, Ink — nie eine grosse, schwere Fläche.

Das Prinzip

01

Weiss ist der Grund

Alles sitzt auf Weiss, getrennt über feine Linien statt Farbbalken. Keine grossen dunklen Flächen — sie wirken zu schwer; Dunkel nur als kleiner Akzent.

02

Ein CTA nur bei einer Hauptaktion

Gefüllt (Mint) wird nur, wenn es genau eine naheliegende Aktion gibt — Formular: „Abbrechen" vs. „Speichern". Viele gleichrangige, nicht konkurrierende Funktionen bleiben alle gerahmt — nicht alles darf wichtig sein.

03

Mint grosszügig

Mint als Unterstreichung, Tag, Aktiv-Zustand, Hover-Füllung — und als Textfarbe für Links und Akzente (im kontraststarken Ton).

04

Status als Marker

Statt farbiger Kopfbalken: weisse Karten mit farbigem Randstreifen und kleinem Label. Rot nur als Signal, nicht als Fläche.

Die Farbrollen

Aa — Ink & Rand

Petrol

Überschriften, Ränder, Button-Outline

#1B4E5B
Fläche

Mint

Tag, Unterstrich, Hover-Füllung, gefüllter CTA

#A7E8CB
Aa — Text/Link

Mint (dunkel)

Mint ALS Text/Link auf Weiss

#2D7A5C
● Aa — klein

Navy

Kleiner Akzent: Ink, Punkt, schmales Element — keine grosse Fläche

#171b40
zartes Tag

Hellblau

Zarter Ton: kleines Zähl-Tag, Detail, Unterstrich

#adedf9
● Signal

Frist

Randstreifen, Punkt, Label — nie grosse Fläche

#C0433F

Warum zwei Mint-Töne? Das helle Mint #A7E8CB ist auf Weiss zu kontrastarm für Text (unlesbar). Es bleibt daher Akzent-Fläche; für Mint als Text/Link nimmt ein dunklerer Mint-Ton #2D7A5C die Rolle — same Familie, aber lesbar.

Konkrete Anwendung

Navbar

vorher
nachher

Das Logo — Original-Zeichnung, in hellem Petrol eingefärbt

Kein neues Bild: dieselbe Logo-Zeichnung wie bisher, aber die Farbe kommt aus dem CSS (--petrol-light #2C6E74) — an einem Wert beliebig nachjustierbar, ohne die Datei zu ändern.

Buttons — ein gefüllter CTA nur bei einer Hauptaktion

Formular — eine Hauptaktion

Es gibt genau eine naheliegende Fortsetzung. Sie wird gefüllt (Mint), die Alternative bleibt zurückhaltend.

Werkzeugleiste — gleichrangig

Viele eigenständige Funktionen, die nicht konkurrieren. Keine wird hervorgehoben — alle gerahmt.

Hover — kräftig (fahr mit der Maus über die Buttons)

→

Gerahmt → Navy mit Lightblue-Text

→

CTA → Navy mit Lightblue-Text

→

Abbrechen → nur zarte Tönung

Alle Aktions-Buttons teilen denselben Hover: Navy-Grund mit Lightblue-Text — die Kundenfarben genau an der Interaktion. Nur Abbrechen bleibt zurückhaltend, damit die eine Hauptaktion erkennbar bleibt.

Termin-Karten & Übersicht

vorher — farbiger Kopf
Veloweggesetz Frist
09.09.2026 · Eingabe
Fachkommission Sitzung
18.09.2026 · Biodiversität
nachher — weiss + Randstreifen
● Frist
Veloweggesetz Vernehmlassung
09.09.2026 · Eingabe
● Sitzung
Fachkommission Biodiversität
18.09.2026 · Luzern
● Bevorstehend
Vorbereitung Eingabe
in 3 Tagen

Übersicht — nachher

Luzern
Ohne Gemeinde

Navy & Hellblau — sparsam, als kleiner Akzent

Ganz dunkle Flächen wirken zu schwer. Navy bleibt daher ein kleiner Akzent — Ink, ein Punkt, ein schmales Element — auf weissem Grund. Hellblau spielt als zarter Ton dazu.

Dokumente 12 Dateien

Navy als Ink und Punkt, Hellblau als kleines Zähl-Tag — dunkel spürbar, ohne dunkle Fläche.