Großunternehmen · Deutschland
SAP · Deutsche Bank · Bosch · Commerzbank
Corporate Design
Style Guide
Falk Schmidt, LL.M. — verbindliche Gestaltungsgrundlagen für Online und Print.
01 Marke
Positionierung
Falk Schmidt, LL.M. — Management Consulting. Enterprise Architekt, Datenschutz-Jurist, Projektmanager. Die Marke tritt editorial auf: nah an einer Wirtschaftspublikation, nicht an einer Agenturseite.
Gestaltungsprinzipien
- Ruhe durch Raster. Großzügiger Weißraum, strikter 4-pt-Rhythmus.
- Typografie trägt. Serif für Leitsätze, Sans für Fließtext, Mono für Labels.
- Farbe spart. Dominierend off-white und near-black; Marineblau akzentuiert, Burgunder tupft.
- Kein Zierrat. Haarlinien statt Boxen, 80-px-Akzentstrich statt Dekor.
- Evidenz vor Effekt. Zahlen, Zitate, Referenzen — keine Buzzwords.
Claim
„KI braucht weder Helden noch Gurus, sondern strategische Konzepte mit der präzisen Abwägung des rechtlichen Rahmens und professionelle IT-Implementierung."
Leitsatz · Hero-Folgesektion der Website.
Sprachgebrauch
- Anrede: Sie (formell, konsistent).
- Juristische Zitierweise: Art. 6 Abs. 1 lit. f DSGVO, § 5 DDG.
- Tonalität: präzise, unaufdringlich, ohne Übertreibungen.
02 Logo & Wortmarke
Markenzeichen
Wortmarke · Anthrazit auf Hell
Monogramm (gerahmt) · Favicon / Avatar
Invertiert · auf #0B0B0B
Farbvarianten
| Anthrazit (Standard) | #1A1A1A | Helle Untergründe, Briefbögen, Visitenkarte |
| Weiß (invertiert) | #FAFAF7 | Dunkle Flächen, Footer, dunkle Slides |
| Schwarz (Mono-Print) | #000000 | Einfarbiger Druck, Fax, Stempel |
Schutzraum
Um das Logo bleibt mindestens ein Schutzraum von x = halbe Logo-Höhefrei. In dieser Zone dürfen keine anderen Elemente (Text, Grafik, Kante).
Gestrichelte Linie = Schutzraumgrenze
Mindestgrößen
| Medium | Wortmarke | Monogramm |
| Online (Bildschirm) | 24 px Höhe | 16 px |
| 8 mm Höhe | 6 mm | |
| Favicon / App-Icon | — | 16 × 16 px |
Don'ts
- Nicht verzerren, rotieren oder beschneiden.
- Keinen Schlagschatten, Outline oder Verlauf.
- Nicht in markenfremde Farben einfärben — nur die drei Varianten oben.
- Nicht auf unruhigem Bildhintergrund ohne Abdeckfläche platzieren.
- Monogramm-Rahmen nicht öffnen, nicht in anderer Form verwenden.
03 Farbsystem
Basis: warmes Off-White (Porzellan) mit einem Near-Black, der minimal ins Warme kippt. Akzent: tiefes Marineblau. Burgunder bleibt Sonderanlässen vorbehalten. Palette für sRGB (Bildschirm). CMYK-Werte sind Richtwerte — vor Druck mit ICC-Profil und Proof abstimmen.
Basis & Text
PorzellanGrundfläche#FAFAF7
Warm-GrauSektion / Card#F2F1ED
Near-BlackText / Headline#0E0E0E
Text MutedUntertitel#3A3A38
Text FaintMono-Labels#595954
Akzent (Alltag)
Marine-TiefLinks, Buttons, Akzentlinie#0A2540
Marine HoverHover / Focus#153B63
Marine FaintBadge / Tint#E8ECF2
Akzent (Besonders — sparsam!)
BurgunderFehler / Tupfer#6B1F28
Burgunder FaintHinweis-BG#F4E8E9
Linien
HairlineTrennlinie 1 px#E5E4DF
Linie starkRahmen / Divider#CDCCC6
Farbregeln
- Höchstens zwei Akzentfarben pro Layout (Marine + optional Burgunder).
- Burgunder niemals flächig — nur als Strich, Stichpunkt oder sehr kleines Feld.
- Fließtext in Near-Black; Meta/Untertitel in Text Muted/Faint.
- Dunkle Sektionen auf
#0B0B0B, nicht auf pures Schwarz.
04 Typografie
Einheitlich IBM Plex — selbstgehostet, keine externe Verbindung. Drei Schnitte: Sans für Sprache, Serif für Leitsätze, Monofür Marker und technische Details.
IBM Plex Sans · Primär
Falk Schmidt, LL.M.
Enterprise Architect · Datenschutz-Jurist · Projektmanager
ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz · 0123456789 · ÄÖÜß
Gewichte: Regular 400 (& Italic), Medium 500, SemiBold 600, Bold 700.
IBM Plex Serif · Leitsätze
„Unklarheit kostet."
ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz · 0123456789
Gewichte: Regular 400 (& Italic), Medium 500 (& Italic).
IBM Plex Mono · Labels & UI
01 — Leistungen
ABCDEFGHIJKLMNOPQRSTUVWXYZ · abcdefghijklmnopqrstuvwxyz · 0123456789
Gewichte: Regular 400, Medium 500. Labels UPPERCASE · letter-spacing: 0.04em.
Typo-Skala (Web)
--text-xs | 0.75 rem · 12 px | Mono-Labels, Caption |
--text-sm | 0.875 rem · 14 px | Meta-Text, Form-Hint |
--text-base | 1 rem · 16 px | Body (Standard) |
--text-lg | 1.125 rem · 18 px | Lead-Paragraph |
--text-xl | 1.375 rem · 22 px | H3 klein, Subhead |
--text-2xl | 1.75 rem · 28 px | H3, Card-Title |
--text-3xl | 2.25 rem · 36 px | H2 |
--text-4xl | 3 rem · 48 px | H1 (Standard) |
--text-5xl | 4 rem · 64 px | Hero klein |
--text-6xl | 5.25 rem · 84 px | Hero groß |
--text-7xl | 7 rem · 112 px | Stat-Zahl / Manifest |
Zeilenhöhe & Laufweite
--leading-tight | 1.1 | Hero-Headlines |
--leading-snug | 1.25 | H1–H3 |
--leading-normal | 1.55 | Fließtext |
--leading-loose | 1.75 | Lange Lesestrecken |
--tracking-tight | −0.02 em | Hero |
--tracking-snug | −0.01 em | H1–H3 |
--tracking-wide | +0.04 em | Mono-Labels |
--tracking-wider | +0.1 em | Display-Labels |
Text-Utilities
Zwei globale Klassen für Fließtext-Seiten. Wer sie kombiniert, muss wissen was er tut — sie stapeln sich kumulativ.
.lead · einleitender Absatz
Ich denke systemisch, plane voraus und arbeite bevorzugt dort, wo Komplexität auf Strukturbedarf trifft.
font-size: --text-lg · color: --color-text-muted. Kein eigener Font — erbt IBM Plex Sans vom <body>. Setzt keinenmargin-top, daher von Haus aus eng am vorigen Element.
.prose · Lesestrecken-Wrapper
Regulärer Fließtext in .prose erhält automatischmax-width: --max-reading.
Aufeinanderfolgende Absätze bekommen margin-top: --space-4.Hervorhebungen erhalten volle Textfarbe zurück.
Wrapper-Klasse um zusammenhängenden Textblock. Enthält Regeln fürp + p (Abstand), p (max-width), h2,ul und strong. Nicht mit .leadverwechseln — Kombination ist möglich, dann wirkt .lead nur auf den einzelnen Absatz.
05 Raster & Abstände
Alle Abstände folgen einem 4-px-Grundraster. Tokens in rem definiert (1 rem = 16 px). Für Print: 1 pt ≈ 0,353 mm; die mm-Spalte ist Orientierung.
Skala
--space-1 | 0.25 rem · 4 px · 1.06 mm | Mikro-Gap (Icon ↔ Text) |
--space-2 | 0.5 rem · 8 px · 2.12 mm | Enger Gap |
--space-3 | 0.75 rem · 12 px · 3.18 mm | Kleiner Gap |
--space-4 | 1 rem · 16 px · 4.23 mm | Absatz zu Label |
--space-5 | 1.25 rem · 20 px · 5.29 mm | Formular-Gap |
--space-6 | 1.5 rem · 24 px · 6.35 mm | Container-Padding |
--space-8 | 2 rem · 32 px · 8.47 mm | Absatz-Abstand |
--space-10 | 2.5 rem · 40 px · 10.58 mm | Grid-Gap |
--space-12 | 3 rem · 48 px · 12.70 mm | Block ↔ Block |
--space-16 | 4 rem · 64 px · 16.93 mm | Section kompakt |
--space-20 | 5 rem · 80 px · 21.17 mm | Akzentstrich-Länge |
--space-24 | 6 rem · 96 px · 25.40 mm | Section Standard |
--space-32 | 8 rem · 128 px · 33.87 mm | Hero-Padding |
--space-40 | 10 rem · 160 px · 42.33 mm | Seiten-Intro |
Visuelles Lineal
4
8
16
24
48
96
160
Weißraum-Regeln
- Section-Padding vertikal
--space-24(96 px). Hero oben--space-40, unten--space-16. Kompakt-Section (.section--tight)--space-16vertikal. - Absatz → Absatz
--space-4. Absatz → neue Überschrift--space-8. - Cards padding
--space-8rundum (eine Zahl, nie asymmetrisch). - Card-Grids innerhalb von
.container(nicht--narrow). Grid-Gap--space-6(24 px). Auto-Fit-Spalten mitminmax(20rem, 1fr)ergeben 3 Spalten desktop, 1 Spalte mobile. - Container-Wahl:
.container(1200 px) für Cards/Grids/Layouts;.container--narrow(896 px) für Hero und Intro-Texte;.container--reading(680 px) für Fließtext. - Block ↔ Block innerhalb einer Section:
--space-12(z. B. zwischen Section-Header und Grid). - Akzentstrich: 80 × 4 px, Marine-Tief, darüber
--space-4, darunter--space-6. - Nie kleiner als 4 px, nie Token-Lücken füllen (z. B.
--space-7existiert nicht — kein Pseudo-Wert).
06 Layout
Container
--max-content | 75 rem · 1200 px | Standard (Grids, Header) |
--max-narrow | 56 rem · 896 px | Rechtstexte, Formulare |
--max-reading | 42.5 rem · 680 px | Lange Lesestrecken |
Section-Rhythmus
Drei Hintergrund-Töne wechseln ab. Nie zweimal die gleiche Farbe hintereinander.
A · Porzellan
#FAFAF7B · Warm-Grau
#F2F1EDC · Dunkel
#0B0B0BEcken, Linien, Schatten
--radius-sm | 3 px | Tags, Chips |
--radius-md | 8 px | Inputs, Buttons |
--radius-lg | 16 px | Cards |
--border-hair | 1 px · #E5E4DF | Section-Divider |
--border-strong | 1 px · #CDCCC6 | Form-Rahmen |
sm
md
lg
Schatten sind weich und warm — kein harter Schlagschatten.
07 Komponenten
Section-Header
.section-header
01 — Leistungen
Klarheit schaffen.
Button
.btn
Pull-Quote · Testimonial
.pull-quote
„Falk hat Struktur gebracht, wo keine war — und auf jedem Meeting den roten Faden."B.B. · Wiesbaden
Lead-Quote · Leitsatz
.lead-quote
„Unklarheit kostet."
Referenz-Kachel
.ref-card
Formularfeld
.form-group · Label + Input
Link (Inline)
.link-inline
Beispiel: Mehr dazu im Datenschutz-Abschnitt.
1 px Unterstrich in Linie-stark; Hover → Marine-Tief.
Globaler Default: a-Tags ohne Klasse erscheinen optisch als reiner Text (verhindert Kollisionen mit Cards/Buttons/Logo-Ankern). Innerhalb von Text-Wrappern (.prose, .lead, .form-hint, .termin-sub) werden klassenlose a-Tags automatisch wie .link-inlinegestylt — damit das Klassen-Vergessen in Fließtext nicht zur unsichtbaren Verlinkung führt. Außerhalb dieser Wrapper bleibt .link-inline Pflicht.
08 Bildsprache
Ja
- Portrait: Tageslicht, neutraler Hintergrund, ruhiger Blick.
- Detail-Stills: Bücher, Notizen, Hände — dokumentarisch.
- Architektur: klare Linien, graphischer Ausschnitt.
- Farbigkeit entsättigt, leicht warm.
Nein
- Keine Stock-Klischees (Handshake, Sprint-Board).
- Kein HDR, keine übersättigten Farben.
- Keine Vignetten, keine Filter-Looks.
- Icons ersetzen keine Bilder.
Icon-Set · Business (massiv)
Für inhaltstragende Kacheln (Leistungsfelder, Nutzen, Gründe) verwendet die Marke ein einheitliches Icon-Set in solidem, massivem Business-Stil. Einfarbig, ausschließlich currentColor (standardmäßig--color-accent = Marine-Tief). 48 × 48-Raster, 4 px Sicherheitsrand. Keine Strichstärken — Form entsteht aus Flächen, nicht aus Linien.
Verwendung
- Inline per
<svg><use href="#icon-…"/></svg>— Farbe folgtcurrentColor. - Für externe Nutzung liegen alle Icons als Einzeldateien in
/icons/*.svgbereit. - Mindestgröße 24 px. Standardgröße 40–64 px. Für Hero-Teaser 72–96 px.
- Farbe: Marine-Tief
#0A2540auf hellem Hintergrund; Off-White#FAFAF7auf Marine. Burgunder nur für besondere Anlässe, nie als Dauerfarbe. - Niemals kombinieren mit Outline-Icons (z. B. Lucide, Feather) — die Bildwirkung wäre inkonsistent.
Abstände & Rahmen
Icon in Kachel: 4 × 4-Raster-Quadrat mit optischem Zentrum. Abstand zum Titel darunter var(--space-4). Kein Rahmen, kein Schatten, kein Farbkreis hinter dem Icon — das Icon selbst trägt die Bildfläche.
09 Tonalität
So klingt die Marke
- Präzise. Eine Aussage pro Satz.
- Ruhig. Keine Ausrufezeichen. Keine Superlative.
- Faktisch. Referenzen, Paragraphen, Zahlen — keine Versprechen.
- Zurückhaltend persönlich. Ich-Form dort, wo es Bezug schafft.
Vermeiden
- Marketing-Floskeln („ganzheitlich", „maßgeschneidert", „innovativ").
- Englische Fachbegriffe, wenn ein deutscher Begriff passt.
- Emoji im Fließtext.
- Selbstlob ohne Beleg.
Beispiele
Nicht so
„Wir bieten innovative, maßgeschneiderte Lösungen, die Ihr Unternehmen ganzheitlich in die digitale Zukunft führen!"
Besser
„Enterprise-Architektur und Datenschutz — strukturiert, belegbar, mit Paragraph hinterlegt."
10 Web → PDF
Diese Seite ist via Browser-Druck direkt als PDF exportierbar. Das Print-CSS ist in der Datei enthalten (@media print).
| Seitenformat | A4 Hochformat |
| Seitenränder | 22 mm oben · 20 mm rechts · 22 mm unten · 22 mm links |
| Basisschrift | 10 pt · IBM Plex Sans |
| Sidebar & Site-Chrome | ausgeblendet |
| Sections | starten auf neuer Seite (page-break-before: always) |
| Farben | werden gedruckt (print-color-adjust: exact) |
| Links | URLs stehen in Klammern neben dem Link-Text |
| Fußzeile | „Falk Schmidt, LL.M. · Style Guide · Seite n" via @page |
Empfohlene Druck-Einstellungen
- Hintergrundgrafiken aktivieren (damit Farb-Swatches sichtbar bleiben).
- Kopf- und Fußzeilen des Browsers deaktivieren.
- Skalierung 100 % (kein „An Seite anpassen").
- Empfohlen: Chromium-basierte Browser (beste Print-CSS-Unterstützung).
11 Dokumente & DIN
Anforderungen an alle gedruckten Dokumente: Seitenformate, Zoneneinteilung nach DIN 5008:2020, Typografie in Punkt-Werten, Elementpositionen und dokumenttypen- spezifische Vorgaben.
A · Seitenformate
| DIN A4 | 210 × 297 mm | Standard · Geschäftsbriefe, Angebote, Berichte |
| DIN A5 | 148 × 210 mm | Kurzmitteilungen, Memos (selten) |
| DIN A4 quer | 297 × 210 mm | Tabellen, Stundennachweise mit vielen Spalten |
| Visitenkarte | 85 × 55 mm | Standard-Format Europa (85 × 55 mm) |
| DL-Kuvert (Sichtfenster) | 110 × 220 mm | Anschriftfeld 45–90 mm von oben sichtbar |
| Präsentation | 1920 × 1080 px · 16:9 | 33,87 × 19,05 cm bei 144 dpi |
B · Geschäftsbrief nach DIN 5008:2020 · Zonenkarte
Maßstäbliche Darstellung · 1 mm ≈ 1,9 px · Alle Maße in mm ab Blattkante.
Briefkopf
0–27 mm
0–27 mm
Anschriftfeld
45–90 mm
85 × 45 mm
45–90 mm
85 × 45 mm
Bezugszeichen · 97–105 mm
Betreff · ab 115 mm
Brieftext
ab ~127 mm
ab ~127 mm
← 25 mm links
20 mm →
| ■ | Briefkopf 0–27 mm · Logo, Name, Anschrift, Kontakt |
| ■ | Anschriftfeld 45–90 mm von oben · 20 mm von links · 85 × 45 mm Absenderkurzangabe (6 pt) + Empfänger |
| ■ | Bezugszeichenzeile Ab 97 mm · Datum, Aktenzeichen, Durchwahl, Mandat |
| ■ | Betreff Ab 115 mm · fett, ohne „Betreff:"-Präfix |
| ■ | Brieftext Ab ca. 127 mm · Anrede → Text → Grußformel → Unterschrift |
| — | Falzmarken 87 mm & 192 mm für DL-Kuvert Lochmarke 148,5 mm (Seitenmitte) |
| ■ | Fußzeile Ab 262 mm · Kanzlei/Firma, USt-ID, Bank, ggf. Seite x/y |
C · Seitenränder nach Dokumenttyp (in mm)
| Dokumenttyp | Links | Rechts | Oben | Unten | Begründung |
| Geschäftsbrief (DIN 5008) | 25 | 20 | 27 | 18 | Norm-konformes Anschriftfeld, Fensterkuvert DL |
| Angebot / Proposal | 25 | 20 | 25 | 20 | Geschäftsbrief-ähnlich, mit Deckblatt |
| Rechnung | 25 | 20 | 27 | 20 | DIN 5008, Fußzeile mit Bank & USt-ID (Pflicht § 14 UStG) |
| Beratungsbericht / Gutachten | 30 | 20 | 25 | 20 | Lochrand links, Platz für Randnotizen |
| Interner Vermerk | 25 | 25 | 25 | 20 | Symmetrisch, ohne Anschriftfeld |
| Präsentations-Handout | 20 | 20 | 20 | 20 | Maximale Nutzfläche, kompakte Fußzeile |
| Tabelle / Stundennachweis (A4 quer) | 20 | 15 | 20 | 15 | Maximale Tabellenbreite |
D · Typografie für Druck (pt-Werte)
Im Druck: absolute Punktgrößen (pt). 1 pt = 0,353 mm = 1/72 Zoll. Primär: IBM Plex Sans (selbstgehostet). Fallback für Office-Dokumente: Arial.
| Element | Größe | Gewicht | Anmerkung |
| Grundschrift · Brieftext | 11 pt | 400 | DIN 5008 empfiehlt 11–12 pt |
| Grundschrift · Bericht | 10,5 pt | 400 | Für längere Dokumente, kompakt |
| Titel / H1 | 20 pt | 700 | Deckblatt, Berichtstitel |
| Überschrift H2 | 14 pt | 600 | Hauptabschnitte |
| Überschrift H3 | 11 pt | 600 | Unterabschnitte |
| Mono-Label / Kapitelnummer | 8 pt | 500 | UPPERCASE, letter-spacing: 0.08em |
| Absenderkurzangabe (Kuvert) | 7 pt | 400 | Erste Zeile im Anschriftfeld |
| Fußzeile | 8 pt | 400 | In #595954 |
| Seitenzahl | 9 pt | 400 | Mono, rechtsbündig: „Seite x von y" |
| Zeilenabstand (Brieftext) | 14 pt | — | = 11 pt × 1,27 |
| Absatzabstand | 0 pt | — | DIN 5008: Absatztrennung durch Leerzeile |
| Zeilenabstand (Bericht) | 13 pt | — | bei 10,5 pt Grundschrift |
E · Briefkopf · Pflichtangaben & Aufbau
| Position | 0–27 mm vom oberen Blattrand | Innerhalb dieser Zone bleiben; nicht überragen |
| Logo | Links oben, bevorzugt Wortmarke | SVG/PDF-Einbettung · Mindesthöhe 8 mm |
| Absenderangaben | Rechts oder unter Logo | Falk Schmidt, LL.M. Management Consulting c/o FS/CS GmbH · Mühlstr. 13–15 · 63667 Nidda office@falkschmidt.pro · +49 1514 313 314 8 |
| Trennlinie | Bei 27 mm / Unterkante Briefkopf | 0,5 pt · Marine-Tief #0A2540 oder Linie-stark #CDCCC6 |
| Farbton | Logo in Anthrazit #1A1A1A, Text in Near-Black #0E0E0E | Kontakt-Zeile in Text Muted #3A3A38 |
F · Fußzeile · Pflichtangaben
| Position | Ab 262 mm (35 mm vor Blattkante unten) | Trennlinie 0,3 pt, darunter 2 mm Abstand zum Fußtext |
| Schrift | 8 pt · Text Faint #595954 | Kleiner als Grundschrift, noch lesbar |
| Pflichtinhalt (Geschäftsbrief) | Falk Schmidt, LL.M. · Management Consulting · c/o FS/CS GmbH · Mühlstraße 13–15 · 63667 Nidda ·office@falkschmidt.pro | |
| Pflichtinhalt (Rechnung) | Zusätzlich: Bankverbindung (IBAN, BIC), Steuernummer / USt-IdNr., Angabe nach § 14 UStG | |
| Seitenzahl | Bei ≥ 2 Seiten: „Seite x von y" rechtsbündig, 9 pt Mono | |
G · Dokumenttypen
Extern · Geschäft
Geschäftsbrief
- DIN A4 hoch · DIN 5008:2020
- Ränder 25/20/27/18 mm
- Grundschrift 11 pt · Plex Sans
- Anrede → Text → Grußformel → Unterschrift
- Falzmarken & Lochmarke druckbar
Extern · Geschäft
Angebot / Proposal
- DIN A4 hoch · Deckblatt + Inhalt
- Ränder 25/20/25/20 mm
- Deckblatt: Mandat, Aktenzeichen, Datum
- Leistung, Zeitrahmen, Honorar, Bedingungen
- Ausfertigung & Unterschrift
Extern · Finanz
Rechnung
- DIN A4 hoch · DIN 5008
- Ränder 25/20/27/20 mm
- Pflicht § 14 UStG: USt-IdNr., fortlaufende Nummer, Leistungsdatum
- Bankverbindung in Fußzeile
- Format: PDF/A-2b
Mandat · Bericht
Beratungsbericht / Gutachten
- DIN A4 hoch · mehrseitig
- Ränder 30/20/25/20 mm (Lochrand links)
- Grundschrift 10,5 pt · 13 pt Durchschuss
- Gliederung nummeriert (1 · 1.1 · 1.1.1)
- Kopfzeile: Mandat + Aktenzeichen + Seite
Intern
Vermerk / Memo
- DIN A4 hoch · einseitig bevorzugt
- Ränder 25/25/25/20 mm (symmetrisch)
- Kopf: An · Von · Betr. · Datum
- Ohne Anschriftfeld, ohne Falzmarken
Präsentation
Slide-Deck
- 16:9 · 1920 × 1080 px
- Außenrand 64 px · Content-Safe-Area
- Titel 28–32 pt · Body 18–22 pt
- Max. 6 Bullets pro Slide
- Fußzeile: Logo links · Seitennr. rechts
Identität
Visitenkarte
- 85 × 55 mm · 350 g/m² ungestrichen
- Rand 4 mm rundum
- Vorder: Logo + Name + Rolle
- Rück: Kontakt (E-Mail, Telefon, Web)
- Grundschrift 7,5–9 pt · Plex Sans
Identität
Briefbogen (Template)
- DIN A4 · Munken Pure 100 g/m²
- Briefkopf 0–27 mm mit Wortmarke
- Trennlinie 0,5 pt Marine-Tief
- Fußzeile ab 262 mm mit Pflichtangaben
- Falz- und Lochmarke als Feinraster-Zeichen
H · Druck-Spezifikationen
| Papier · Briefbogen | Munken Pure oder vergleichbar ungestrichen | 100–120 g/m² · FSC-zertifiziert |
| Papier · Visitenkarte | 350 g/m² ungestrichen | Optional Prägung Logo |
| Farbraum | CMYK | ICC: ISO Coated v2 (gestrichen) / PSO Uncoated v3 FOGRA52 |
| Sonderfarbe (optional) | Marine-Tief als Pantone | Pantone 539 C (Orientierung) |
| Bildauflösung | 300 dpi | Am Endformat, vor Skalierung |
| Logo-Einbettung | Vektor | SVG / PDF — nie pixelbasiert |
| Anschnitt (Bleed) | 3 mm | An allen randabfallenden Elementen |
| Sicherheitsabstand | 5 mm | Vom Beschnitt bis zu wichtigen Elementen |
| Druck-PDF | PDF/X-4 | Schriften eingebettet, 3 mm Anschnitt, Beschnittmarken |
| Screen-PDF | PDF/A-2b | sRGB, Bilder ≤ 150 dpi |
12 Barrierefreiheit
Ziel: durchgängig WCAG 2.2 AA. Mindestens 4.5:1 für normalen Text,3:1 für großen Text (ab 18 pt bzw. 14 pt bold) und UI-Komponenten.
Kontraste im Einsatz
| Kombination | Kontrast | WCAG |
| Near-Black #0E0E0E auf Porzellan | ≈ 18:1 | AAA |
| Text Muted #3A3A38 auf Porzellan | ≈ 10:1 | AAA |
| Text Faint #595954 auf Porzellan | ≈ 5.9:1 | AA |
| Text Faint #595954 auf Warm-Grau | ≈ 5.5:1 | AA |
| Marine-Tief #0A2540 auf Porzellan | ≈ 14:1 | AAA |
| Porzellan auf Dunkel #0B0B0B | ≈ 18:1 | AAA |
Regeln
- Interaktive Elemente haben sichtbaren Fokus (3 px Ring Marine-Tief).
- Icons sind nie die einzige Träger einer Information — stets Text oder
aria-label. - Formularfelder haben sichtbares
<label>, nicht nur Placeholder. - Bildalternativen sind aussagekräftig (nie „Bild" oder „Foto").
- Kein Autoplay-Video, keine aufdringliche Bewegung.