Telefon +49 1577 9340518 Düsseldorf · Neuss · Mönchengladbach · NRW
wilfitcoach — Logo
Brand-System · Stand 15.09.2026
wilfitcoach · Wilfrand Brice
Mobiler Personal Trainer, Massage & Ernährungsberatung
Das Signature-Motiv · Die Anfahrt

Ich komme zu Ihnen.

Eine einzige grüne Linie tritt aus dem Logo-Zug hervor, nimmt jede Station auf und endet sichtbar im Anfrageformular. Sie ist der Weg des mobilen Trainers zum Kunden — und das einzige Element, das auf jeder Seite von oben bis unten durchläuft.

01 · Das Logo

Ein Zug, nie abgesetzt

Ein grosses kalligrafisches «W», dessen letzter Aufstrich ohne Unterbrechung in ein «f» übergeht. Keine Ecke, kein Absatzpunkt — der Strich wechselt nur seine Breite: hauchdünn im Aufstrich, breit im Abstrich. Das ist eine Spitzfeder, geschrieben statt konstruiert. Der Verlauf läuft von Violett über Gold nach Grün: ein Weg mit Richtung, kein Muster.

Logo auf Cremegrund
Logo einfarbig weiss auf dunklem Grund
02 · Farbrollen — gemessen, nicht gewählt

Jede Farbe hat einen Ort

Alle Werte stammen wörtlich aus der deterministischen Logo-Messung. Gold ist ausschliesslich Handlungsfarbe und nie Schrift; Grün ist ausschliesslich Grafik; Violett trägt genau eine Sektion.

Grund
#faf7f2 · surface
Standard-Hintergrund der ganzen Seite, aller Karten, aller Felder.
ink darauf: 15.3 AAA
Zweiter Grund
#f9f1e3 · surface-alt
Der einzige zweite Grund: Erzählstrecken, Utility-Zeile, Beweis-Karten.
ink darauf: 14.58 AAA
Aa
Fliesstext
#241f18 · ink
Headlines und Fliesstext. Espresso, nie reines Schwarz.
auf surface: 15.3 AAA
Aa
Nebentext
#5d584f · ink-soft
Lead-Absätze, Bildunterschriften, Hilfetexte. Nie unter 15px.
auf surface: 6.61 AA
Termin anfragen
Handlung
#ffc730 · primary
Nur Fläche. Genau ein gefüllter CTA pro Band. Niemals Schrift.
on-primary darauf: 10.25 AAA
Aa
Marke als Schrift
#8f6500 · primary-ink
Eyebrows, Inline-Links, Telefon im Hover — wo die Marke ein Wort sein muss.
auf surface: 4.88 · nachgerechnet
Aa
Kontrast-Sektion
#65567c · secondary
Genau eine dunkle Sektion pro Seite (Massage) plus die Stationspunkte.
weiss darauf: 6.61 AA
Die Anfahrt
#70d981 · line
Das Signature-Motiv. Grafik — nie Text, nie Icon-Strich, nie Kartenrand.
1.65 auf surface · nur dekorativ
Anfahrt über Foto
#85b777 · line-deep
Dieselbe Linie, solange sie über eine Bildfläche läuft.
nicht auf Violett: 2.85
Haarlinie
#d1cec7 · border
1px-Ränder von Karten, Inputs, Tabellen. Nie als Textfarbe.
dekorativ

Gold-Skala · Abstufungen nur aus der Messung

1
2
3
4
5
6
7
8
9
10
11
12

Violett-Skala

1
2
3
4
5
6
7
8
9
10
11
12

Grau-Skala

1
2
3
4
5
6
7
8
9
10
11
12
03 · Typografie

Noto Serif Display / Nunito Sans

Der Logo-Zug ist eine Spitzfeder: dünn im Aufstrich, breit im Abstrich. Die typografische Entsprechung ist ein Serif mit hohem Strichkontrast — nicht eine Grotesk. Der kalligrafische Italic trägt das eine kursive Wort im Hero.

display-hero
64 / 38px · 600 · 1.04 · −1.6px
Ich komme zu Ihnen.
display-hero-em
64px · 500 italic · −1.2px
zu Ihnen
display-xl
48 / 32px · 600 · 1.12 · −1.1px
Seit über 20 Jahren unterwegs
display-lg
32 / 26px · 600 · 1.18 · −0.6px
Bodyform-Massage
display-md
26 / 22px · 600 · 1.22 · −0.4px
Schwerpunkt Frauen ab 40
heading-sm · Nunito
20 / 19px · 700 · 1.35
Wo soll trainiert werden?
body-lg · Nunito
17 / 16px · 400 · 1.65
Betreuung im Fitnessstudio, zu Hause, im Büro, im Hotel oder draussen — in Düsseldorf, Neuss, Mönchengladbach und ganz NRW. Jeder Körper ist anders, deshalb wird jede Einheit an körperliche Voraussetzungen, Tagesform und Ziel angepasst.
body · Nunito
15px · 400 · 1.6
Standard-UI-Text in Karten, Navigation und Formularen.
mono-field · IBM Plex Mono
13px · 500 · +0.4px
+49 1577 9340518 · Kranzstraße 16 · 41065 Mönchengladbach
mono-marker
10px · 500 · +1.2px · Versal
01 Kennenlernen · 02 Plan · 03 Training · 04 Regeneration
04 · Komponenten & Zustände

Jeder Zustand ist ein Wert

Fahren Sie mit der Maus über die Buttons — die Zustände sind echt. Die Reihe darunter zeigt dieselben Zustände fixiert nebeneinander.

Live · hover, press und focus ausprobieren
btn-primary · default / hover / press / focus / disabled
default hover #fbbf41 press #ffd37c focus-ring disabled

Leistungs-Karte mit dem Vier-Felder-Schema

Ohne alle vier Felder darf keine Karte gebaut werden — sie sind die Entscheidungsgrundlage, die allen vier lokalen Wettbewerbern fehlt.

Training

Personal Training, mobil

Ein Training, das dort stattfindet, wo Sie ohnehin sind — und das sich an die Tagesform anpasst statt an einen Plan.

Für wen
Anfänger bis Profi, alle Altersgruppen
Wo
Zu Hause · Büro · Hotel · Studio · draussen
Dauer
Nach Absprache
Was danach anders ist
Mehr Kraft im Alltag — und ein Plan für die Woche.
Massage

Lomi-Lomi-Nui

Grossflächige, fliessende Unterarmarbeit — die Massagekarten tragen als einzige eine blasse Violett-Tönung.

Für wen
Nach harten Trainingswochen, bei Anspannung
Wo
Bei Ihnen zu Hause, mobile Liege
Dauer
Nach Absprache
Was danach anders ist
Gelöste Schultern und ein ruhigerer Schlaf.

Die Anfahrt als Struktur

01 Kennenlernen
Ein Gespräch, ein Ziel

Stationen sitzen als violette Punkte auf der Linie — die Struktur trägt Kontrast (6.19), die Linie darf leise bleiben.

02 Plan
Angepasst an Ihre Voraussetzungen

Kein Kasten, kein Schatten, kein Icon-Grid: Marker, Titel, zwei Zeilen.

03 Training
An Ihrem Wunschort

Auf Mobilgeräten wird daraus eine schmale senkrechte Führung bei 20px — nie ein abgeschnittener Schwung.

05 · Die eine dunkle Sektion

Massage & Regeneration

Genau ein Band der Seite kippt ins Violette. Der Text steht in reinem Weiss (6.61), Haarlinien werden hier zu secondary-8, und die Anfahrt bleibt grün — #70d981 erreicht auf diesem Grund 3.76 und damit die Schwelle für grafische Objekte.


Zusammen mit dem Footer ergibt das einen Dunkelanteil von rund 14 % — der Korridor erlaubt bis 30 %.

06 · Elevation

Die Linie ist das Tiefensystem

Schatten sind Mikro-Lift: immer zwei bis drei weiche Layer in rgb(36 31 24), nie ein harter Layer, nie Schwarz.

0 · flach

Standard. Getrennt wird mit 1px Haarlinie.

1 · Karte

Nur Hover von card-leistung und gescrollte Nav.

2 · schwebend

Hover des Gold-CTA, Hero-Porträt.

3 · haltend

Nur das mobile circle-reveal-Overlay.

07 · Hier endet die Linie

Anfrage

Klicken Sie in ein Feld — der Fokus färbt die Fläche auf primary-3 (#ffe9b9, ink darauf 13.71) und legt den Gold-Glow über den Ink-Ring.

Bitte tragen Sie eine Telefonnummer oder E-Mail ein — sonst kann ich mich nicht bei Ihnen zurückmelden.

Ich melde mich innerhalb von 24 Stunden bei Ihnen.

Die Anfahrt endet hier — der 9px-Punkt links, gefüllt in #65567c. Kein Weiterlaufen in den Footer.
08 · Bildsprache

Ruhig · warm · körperlich

Weiches indirektes Vormittagslicht, warm Richtung #f9f1e3 gezogen, Tiefen in Espresso statt Schwarz, ein einziger kühler Grünton. Keine Studio-Maschinen, kein Vorher-Nachher, keine Kerzen und Steinstapel — und nie ein fremdes Gesicht.

Moodboard: Cremefarbener Raum mit Matte, Handtuch und Ölfläschchen im Morgenlicht