Watercut — Brand-System

Brand-System · Watercut · Stand 22.10.2026

Das Markenpaket

Farben aus dem Logo gemessen, Schrift aus der Formsprache abgeleitet, jede Komponente mit Zuständen. Diese Seite ist der Prüfstein: was hier steht, gilt im Bau.

Signature-Motiv

Der Laufzettel

Mit jedem Teil läuft ein Zettel mit — Nummer, Werkstoff, Dicke, Verfahren, Fertigmaß. Diesen Zettel macht die Marke zu ihrer Schreibweise: ein Beleg ist mehr wert als ein Versprechen.

WZ-26-0417Edelstahl 1.43018,0 mmWasserstrahl1.240 × 620 mmBeleg ▸

WZ-26-0392Aluminium AW-57544,0 mmWasserstrahl + Kanten2.980 × 410 mmBeleg ▸

WZ-26-0351Baustahl S235JR25,0 mmWasserstrahl800 × 800 mmBeleg ▸

WZ-26-0330Wanne, Edelstahl 1.44042,0 mmKanten + Schweißen1.200 × 600 × 150 mmBeleg ▸

Zeile überfahren: Fläche #ebf0f5, Haarlinie #a9cbea, links 3 px Schnittmarke #ec5964 — lückenlos gestapelt, gap 0.

02 · Farben

Gemessen, nicht gewählt

Jeder Wert stammt aus brand-measurements.json. Kontrastzahlen aus der Matrix sind markiert, nachgerechnete ebenso.

Wasserblau

#0c619d

Primärknopf, Links auf Hell, Verfahren in der Zeile

6.12 auf Papier (Matrix)

Tiefblau

#00528d

Hover-Fläche, Fokusring auf Hell

7.57 auf Papier (gerechnet)

Nachtblau

#193a57

Shop-Band, Aktiv-Zustand

11.77 mit Weiß (gerechnet)

Schnittlicht

#6aa1d4

nur auf Dunkel: Akzentschrift, Knopfrahmen

5.97 auf Tinte (gerechnet)

Signalkoralle (Marke)

#ec5964

Schnittmarke: 3-px-Kante, 2-px-Navimarke — nie Fläche, nie Schrift auf Hell

3.18 auf Papier (Matrix) — als Schrift auf Hell gesperrt

Korallenschrift

#b9273c

--brand-secondary-ink — jede rote Schrift auf Hell: Fehler, Pflichtfeld, Stern

5.75 auf Papier (gerechnet)

Tinte

#1c2025

Flächenton aller dunklen Sektionen, Fliesstext

15.32 auf Papier (Matrix)

Tinte leise

#545b62

Nebentext, Legenden (Platzhalter: #7b838d)

6.45 auf Papier (Matrix)

Papier

#f3f8fd

Grundfläche aller hellen Sektionen

Grund

Papier grau

#ebf0f5

zweite helle Ebene, Zeilen-Hover

14.28 mit Tinte (Matrix)

Linie

#cacfd5

Haarlinie, Feldrahmen; auf Dunkel = Nebentext

10.40 auf Tinte (gerechnet)

Weiß

#ffffff

Schrift auf den blauen Markenflächen (nicht auf Koralle), Kartengrund

6.54 auf Wasserblau (Matrix)

Rollentrennung statt Farbwechsel: die Logofarbe #ec5964 bleibt exakt so — sie ist Linie und Marke. Für rote Schrift auf Hell steht daneben die gemessene Abstufung #b9273c (5.75 statt 3.18), für Schrift auf Koralle die Tinte #1c2025 (4.82 statt 3.40 mit Weiß). Verboten: #ec5964 als Schrift auf Hell in jeder Größe (3.18) · #ffffff auf #ec5964 (3.40) · #6aa1d4 als Schrift auf Hell (2.57) · jede rote Fläche größer als eine Zeilenhöhe · Tailwind-Defaults · selbst gemischte Hex-Werte.

03 · Typografie

Barlow Condensed / IBM Plex

Kondensiert, fett, geneigt — wie die Wortmarke. Darunter die Schrift des Konstruktionsbüros, und für jedes Maß die Mono-Schwester mit Tabellenziffern.

H0 Hero-Maß
Barlow Cond. 700
128/48 px · LH .92 · −.02em

4.000 × 2.000 × 150 mm

H1 Seitentitel
Barlow Cond. 700
72/40 px · LH 1.0 · −.015em

Blechbearbeitung

H2 Sektionstitel
Barlow Cond. 700
48/32 px · LH 1.05 · −.01em

Genauigkeit, die man nachmessen kann

H3 Blocktitel
Barlow Cond. 600
28/22 px · LH 1.15 · +.01em

Wasserstrahlschneiden

Lead
IBM Plex Sans 400
21/18 px · LH 1.5

Wir schneiden Ihre Teile kalt — ohne Hitzeeintrag, ohne Verzug, bis 150 mm Materialstärke.

Body
IBM Plex Sans 400 / 600
17/16 px · LH 1.6

Laden Sie Ihre Zeichnung hoch (DXF, STP, PDF). Sie erhalten Ihr Angebot innerhalb 24 Stunden — betont wird ein Begriff je Satz, nie der ganze Satz.

Maßzahl
IBM Plex Mono 500
15/13 px · +.04em · tabular

1.240 × 620 mm · 8,0 mm · ± 0,1 mm

Versal-Label
IBM Plex Sans 600
13/12 px · +.10em

Werkstoff · Dicke · Verfahren

04 · Komponenten

Zustände, keine Adjektive

Radius 0, Mindesthöhe 52 px, Fokus immer als 2-px-Ring. Zum Prüfen: überfahren, klicken, mit der Tabulatortaste ansteuern.

Alle Werkstoffe ansehen

primary: #0c619d → hover #00528d → active #193a57 (translateY 1px) · focus 2 px #00528d, offset 2 px · disabled #d3d7dc/#545b62

Edelstahl 1.4301 · 8,0 mm · Wasserstrahl

Wasserstrahlschneiden

Bis 4.000 bar, ohne Hitzeeintrag, fast jeder Werkstoff. Zuschnitte bis 4.000 × 2.000 × 150 mm.

Verfahren ansehen

05/06 · Abstände und Tiefe

8er-Skala, vier Ebenen

--space-1 · 8

--space-2 · 12

--space-3 · 24

--space-4 · 40

--space-5 · 72

--space-6 · 112

Verhältnis 8 : 24 : 72 = 1 : 3 : 9. Mittelwert-Brei (~32 px überall) ist verboten.

Flachkein Schatten — der Normalfall: Sektionen, Bänder, Zeilen, Knöpfe

Kante1 px #cacfd5 statt Schatten — Karten, Felder, Tabellen

Blatt2 Lagen — verdichteter Kopf, Upload bei Dragover

Abgehoben3 Lagen — nur Overlay/Dialog

09/10 · Bildsprache

Kalt, nah, entsättigt

Streifendes Seitenlicht auf der Schnittkante, Schatten ins Blau-Schwarz, niemand im Bild. Funken und glühendes Metall sind verboten — Wasserstrahl arbeitet kalt.

Moodboard · entsättigt −25 % · Schatten Richtung #1c2025

07 · Haltung

Do

Jede Aussage trägt eine Zahl.
Ein Knopf je Block.
Jedes Foto bekommt Werkstoff und Dicke als Legende.
Haarlinie statt Karte, Kante statt Schatten.
Anfrageweg schriftlich: Zeichnung hoch, Antwort in 24 Stunden.

Don't

Keine Kachelwand, kein Icon-Grid, kein Karussell.
Telefon nie als Haupt-CTA, keine Nummer im Kopf.
Kein Aluminiumsägen, keine CNC-Profilbearbeitung — entfallen.
Keine Bewertungssterne, kein Review-Widget.
Keine Rundungen, keine Wasser-Romantik, kein Gradient-Hero.

Das Markenpaket

Der Laufzettel

Gemessen, nicht gewählt

Barlow Condensed / IBM Plex

Genauigkeit, die man nachmessen kann

Wasserstrahlschneiden

Zustände, keine Adjektive

Wasserstrahlschneiden

8er-Skala, vier Ebenen

Standardteile ohne Zeichnung?

Kalt, nah, entsättigt

Do

Don't

Angebot innerhalb 24 Stunden