Brand Foundation

Ein Markenhandbuch, das Menschen und KI-Modelle gleichermassen steuert.

Klassische Guidelines liegen als PDF im Ordner. Dieses hier ist ausführbar: Jede Regel existiert zusätzlich als Prompt, Token-Datei oder Agent-Anweisung. Damit erzeugen Textmodelle, Bildmodelle und Coding-Tools Ergebnisse, die von Anfang an zur Marke passen.

01

Marke & Haltung

Die Basis jeder Entscheidung — auch für ein Modell, das nur diesen Abschnitt liest.

Claim

Engineering Secure Intelligence

Kodax macht Unternehmen zu AI-nativen Organisationen — sicher, souverän, schweizerisch.

Sicherheit ist Voraussetzung

Kein Feature, das man dazubucht.

Klarheit vor Cleverness

Wir erklären, wir beeindrucken nicht.

Substanz vor Hype

Keine leeren KI-Versprechen, nur belegbare Ergebnisse.

Schweizer Souveränität

Daten, Betrieb und Verantwortung bleiben bestimmbar.

Zielgruppe

Geschäftsleitung, Verwaltungsrat und IT-Verantwortliche in KMU und regulierten Unternehmen. Risikoavers, zeitknapp, faktenbasiert.

Persönlichkeit (0–10)

Präzision 9 · Wärme 5 · Formalität 6 · Verspieltheit 2 · Technikdichte 5 aussen / 9 in der Tiefe

03

Farben

Marine trägt, Sand atmet, Gold setzt genau einen Akzent pro Sichtfläche.

Marine

#172C45

var(--marine)

Primärfarbe, Text, dunkle Flächen

Marine Deep

#0E1B2E

var(--marine-deep)

Footer, Hero, tiefste Fläche

Marine Mid

#2D4E76

var(--marine-mid)

Sekundärflächen, Diagramme

Sand

#F7F5F2

var(--sand)

Hintergrund hell

Sand 2

#EFECE7

var(--sand-2)

Karten, Muted

Sand 3

#DDD8CF

var(--sand-3)

Linien, Trenner

Gold

#E8C07A

var(--gold)

Akzent, Highlights

Gold Deep

#D9A85A

var(--gold-deep)

Akzent-Text, Hover, Fokus

  • DOFlächenverhältnis als Richtwert: 60 % Sand, 30 % Marine, 10 % Gold.
  • DOAuf Marine: Text in Sand mit 100 / 70 / 50 % Deckkraft.
  • NOMehr als ein Gold-Akzent pro Sichtfläche.
  • NOGold als grosse Fläche oder als Fliesstextfarbe auf Sand.
  • NOBunte Verläufe, Violett/Indigo, Neon, zusätzliche Farben.

60 / 30 / 10

04

Typografie

Geist für alles Gesetzte, Geist Mono für technische Labels, Kennzahlen und Eyebrows.

Display / H1

Engineering Secure Intelligence

Geist 600 · 48–64px · -2% · LH 1.05

H2

Engineering Secure Intelligence

Geist 600 · 30–40px · -2%

H3

Engineering Secure Intelligence

Geist 600 · 20px

Body

Engineering Secure Intelligence

Geist 400 · 16px · LH 1.7

Small / Caption

Engineering Secure Intelligence

Geist 400 · 14px

Label / Eyebrow

Engineering Secure Intelligence

Geist Mono 500 · 11px · +25%

  • DOZeilenlänge 60–80 Zeichen, Headlines maximal drei Zeilen.
  • NOBlocksatz, Silbentrennung, Versalien ausserhalb von Eyebrows.
  • NOInter, Poppins, Serifen- oder Schreibschriften.

05

Layout, Raster & Bewegung

Ruhige Flächen, scharfe Kanten, Tiefe über Kontrast statt Schatten.

Inhaltsbreite

max. 1280 px · Textspalte max. 720 px

Seitenrand

24 px mobil · 48 px Desktop

Sektionsabstand

96 px mobil · 128 px Desktop

Raster

12 Spalten · Gutter 16–24 px

Radius

2 px — Kanten bleiben scharf

Schatten

keine · 1 px Linie in Marine 10 %

Animation

Fade + 12 px Translate · 400–700 ms · ease-out

Reduced Motion

immer respektieren

Verboten

Bounce, Spin, Parallax, Auto-Karussell

Seitenaufbau

  1. 01

    Eyebrow

  2. 02

    H1

  3. 03

    Lead

  4. 04

    Inhaltsblöcke

  5. 05

    Kennzahlen

  6. 06

    ein CTA

Progressive Tiefe ist Pflicht: Führungskräfte lesen Ebene 1, technische Details werden aufgeklappt. Nie beides gleichzeitig zeigen.

06

UI-Bausteine

Kanten bleiben scharf, Flächen unterscheiden sich über Kontrast statt Schatten.

Textlink →

Karte hell

Secure Cloud

Standardkarte auf heller Fläche: 1 px Rahmen, kein Schatten, grosszügiges Padding.

Karte dunkel

Secure AI

Dunkle Sektionen tragen Gold als einzigen Akzent, Text in Sand mit reduzierter Deckkraft.

99.99%

Cloud-Verfügbarkeit

100%

Datensouveränität CH

AES-256

Verschlüsselung

Utility-Regeln für Coding-Tools

Farben nur über Tokens: bg-marine, bg-marine-deep, bg-marine-mid, bg-sand,
bg-sand-2, bg-sand-3, text-gold, text-gold-deep, border-marine/10.
Verboten: text-white, bg-black, bg-[#...], Tailwind-Standardfarben.
Radius 2px (--radius: 0.125rem). Keine rounded-lg/xl/full ausser Avatar.
Keine shadow-*. Tiefe über Hintergrundwechsel und 1px-Border.
Schriften nur font-sans (Geist) und font-mono (Geist Mono).
Eyebrow: font-mono text-[11px] uppercase tracking-[0.25em] text-gold-deep
Sektion: mx-auto max-w-7xl px-6 py-24 lg:py-32
Karte hell: border border-marine/10 bg-card p-8
Karte dunkel: bg-marine-deep p-8 text-sand
Button primär: bg-marine text-sand hover:bg-marine-deep px-6 py-3 text-sm font-semibold
Button Akzent: bg-gold text-marine-deep hover:bg-gold-deep
Ein h1 pro Seite, Title < 60 Zeichen, Meta-Description < 160 Zeichen.
Animation nur Fade + 12px Translate, 400-700ms, prefers-reduced-motion beachten.

07

Bildsprache

Architektur, abstrakte Strukturen, flache Schemata — ruhig und ohne KI-Klischees.

Erlaubt

  • DOArchitektur- und Infrastrukturfotografie, weitwinklig, wenig Menschen.
  • DOAbstrakte Motive: Datenströme, Gitter, Schichten, Gold auf Marine.
  • DOFlache technische Schemata mit dünnen Linien und Knoten.
  • DODokumentarische Porträts aus echten Arbeitssituationen.

Verboten

  • · Roboter, Androiden, Gehirne, Glühbirnen, Zahnräder, Handshakes.
  • · Neon-Cyberpunk, violett-blaue KI-Gradients, Matrix-Code.
  • · Stockfoto-Lächeln, Emoji, Comic, 3D-Blobs.
  • · Text im generierten Bild — Text kommt immer aus dem Layout.

Hero

1920 × 1008

Sektion

1600 × 900

Karte

1200 × 800

OG-Image

1200 × 630

Porträt

1000 × 1250

Behandlung

25–45 % Opazität auf Marine Deep

07·B

Bildgenerator

Stichworte oder Artikel-Link eingeben — das Bild entsteht direkt nach diesen Regeln, in einem einheitlichen, natürlichen Farbklima.

Stichworte oder Thema

Link zum Artikel (optional)

Eigenes Bild (optional)

Wird ein Bild hochgeladen, bleibt das Motiv erhalten und wird in die Kodax Farben und Bildsprache übersetzt.

Bildstil

Heute noch 5 von 5 Versuchen übrig

Die Vorschau erscheint hier und schärft sich, sobald das Bild fertig ist.

08

Sprache & Tonalität

Schweizer Rechtschreibung, Sie-Form, Aussage zuerst — messbar statt blumig.

  • DOAussage zuerst, Begründung danach. Ein Gedanke pro Satz.
  • DOSätze unter 20 Wörtern, Absätze maximal vier Zeilen.
  • DOKonkret: «-80 % Reporting-Aufwand» statt «erhebliche Effizienzsteigerung».
  • DOKein ß — immer ss. Zahlen als 1'250, Währung als CHF 1'250.
  • NOAusrufezeichen, Emoji, rhetorische Fragen in Serie.
  • NOFachbegriffe ohne Erklärung beim ersten Vorkommen.

Verbotene Wörter

revolutionärdisruptivbahnbrechendGame-Changernahtlosganzheitlichunlockempowerjourney

Bevorzugte Wörter

sichersouverännachvollziehbarbelastbarGovernanceDatenhoheitFundamentSchutzschicht

Eyebrow

max. 3 Wörter

H1

max. 9 Wörter

Lead

25–45 Wörter

Absatz

40–70 Wörter

CTA

2–4 Wörter mit →

Meta-Description

max. 155 Zeichen

Terminologie

Kodax · Secure AI · Secure Cloud · Data Foundation · Kodax Hub · Kodax Lab · AI Transformation

Nicht: KODAX, SecureAI, Secure-Cloud, Kodax AI GmbH.

09

Prompt-Bibliothek

Direkt kopierbar. Diese Blöcke machen aus jedem Modell einen Kodax-konformen Autor.

System-Prompt · Textmodelle

Du schreibst als Kodax (Schweiz). Claim: Engineering Secure Intelligence.
Zielgruppe: Geschäftsleitung und IT-Verantwortliche in KMU und regulierten
Unternehmen. Tonalität: präzise, ruhig, faktenbasiert, ohne Marketing-Pathos.

Regeln:
- Schweizer Rechtschreibung: immer ss statt ß. Sie-Form. Zahlen: 1'250. CHF 1'250.
- Aussage zuerst, Begründung danach. Ein Gedanke pro Satz, max. 20 Wörter.
- Aktiv statt Passiv, Verben statt Substantivketten.
- Konkrete Zahlen statt Superlativen. Keine Ausrufezeichen, keine Emoji.
- Fachbegriffe beim ersten Vorkommen in einem Halbsatz erklären.
- Verboten: revolutionär, disruptiv, bahnbrechend, Game-Changer, nahtlos,
  ganzheitlich, "in der heutigen schnelllebigen Welt", unlock, empower, journey.
- Terminologie exakt: Kodax, Secure AI, Secure Cloud, Data Foundation,
  Kodax Hub, Kodax Lab, AI Transformation.
- Nichts erfinden: keine Kundennamen, Preise oder Zahlen, die nicht in der
  Eingabe stehen. Fehlt etwas, frage nach.

Struktur: Eyebrow (max. 3 Wörter), H1 (max. 9 Wörter), Lead (25-45 Wörter),
Absätze zu je einem Gedanken (40-70 Wörter), CTA mit 2-4 Wörtern und Pfeil.

Stil- und Negativblock · Bildmodelle

Style: Kodax brand. Deep navy (#0E1B2E) base, muted sand (#F7F5F2) light
values, a single warm gold accent (#E8C07A). Calm, architectural, documentary
realism or flat technical illustration. Wide angle, generous negative space,
low-contrast matte lighting, no text, no logos.

Negative: logos, lettering, text, watermarks, robots, humanoid AI, brains,
lightbulbs, gears, handshakes, neon cyberpunk, purple or indigo gradients,
stock-photo smiles, 3D blobs, emoji, clutter, oversaturation, HDR look.

Aufgaben-Prompt · Seite schreiben

Schreibe nach den Kodax-Regeln eine Seite zu <Thema>:
Eyebrow, H1, Lead (25-45 Wörter), drei Inhaltsblöcke à 50 Wörter mit
Zwischentitel, drei Kennzahlen (Wert + Beschriftung), ein CTA.
Technische Tiefe separat als optionalen zweiten Layer ausweisen.

News / Blog

Titel, Teaser max. 200 Zeichen, 400–600 Wörter, Quellen inline verlinkt, Fazit «Was das für Schweizer Unternehmen heisst».

LinkedIn

60–120 Wörter, Haken ohne Clickbait, ein konkreter Nutzen, Link am Schluss, max. 3 Hashtags.

Übersetzung

Sinngemäss nach EN/FR, Terminologie unverändert, Länge ±15 %.

Kürzen

Auf N Wörter, Fakten und Zahlen behalten, Superlative entfernen.

Selbstprüfung vor jeder Ausgabe

  1. 1 · Steht die Kernaussage im ersten Satz?
  2. 2 · Ist jedes Adjektiv belegt?
  3. 3 · Kommt ein verbotenes Wort vor?
  4. 4 · Versteht eine Geschäftsleitung den Text ohne Fachwissen?
  5. 5 · Ist die Terminologie exakt geschrieben?

10

Regeln für Coding- und Vibe-Coding-Tools

Damit generierter Code nicht nachträglich umgefärbt werden muss.

  • DOFarben ausschliesslich über Tokens und Utilities der Marke.
  • DOButtons, Karten und Sektionen aus den vorgegebenen Klassenmustern.
  • DOEin h1 pro Seite, eigener Title und eigene Meta-Description.
  • DOBilder mit alt, width, height und lazy loading ausser im Hero.
  • NOtext-white, bg-black, Hex-Werte im Component-Code.
  • NOTailwind-Standardpaletten wie slate, zinc oder indigo.
  • NOshadow-Utilities und Rundungen über 2 px.
  • NONeue Farben, Schriften oder Radien einführen — auch nicht «nur hier».

Richtig

<section className="mx-auto max-w-7xl px-6 py-24">
  <p className="font-mono text-[11px] uppercase
     tracking-[0.25em] text-gold-deep">Leistungen</p>
  <div className="border border-marine/10 bg-card p-8" />
</section>

Falsch

<section className="container py-12">
  <p className="text-indigo-500 uppercase">Leistungen</p>
  <div className="rounded-xl bg-white shadow-lg p-8" />
</section>

11

Anwendung je Kanal

Dieselben Regeln, unterschiedlich ausgespielt.

Website

Aufbau nach Kapitel 05, progressive Tiefe, ein CTA pro Seite.

Präsentation

Marine-Deckblatt, Sand-Inhaltsseiten, eine Aussage pro Folie, Mono-Fusszeile.

Dokument / Offerte

Sand-Grund, Marine-Text, Gold nur in Kopfzeile und Summenzeile.

E-Mail

Text-Look ohne Bildbanner, Signatur als Mono-Zeile.

LinkedIn

Bild 1200 × 627 im Markenstil, Text nach Kapitel 09.

Charts

Datenreihen Marine, Marine Mid, Sand 3 — Highlight-Reihe in Gold.

12

Do / Don't in Kurzform

Der Block, den man in jeden Prompt hängen kann, wenn es schnell gehen muss.

Do

Ruhige Flächen · scharfe Kanten · ein Akzent · konkrete Zahlen · Schweizer Schreibweise · progressive Tiefe · echte Fotografie oder flache Schemata.

Don't

Bunte Gradients · runde Karten mit Schatten · Roboterbilder · Superlative · Ausrufezeichen · Text im generierten Bild · mehr als ein CTA · generierte Logos.

Brand Foundation

So ein Handbuch bauen wir auch für Ihre Marke.

Regelwerk, Token-Datei, Prompt-Bibliothek und Agent-Regeln — damit jedes Modell in Ihrem Unternehmen dieselbe Marke spricht, statt jedes Mal neu geraten zu werden.

Gespräch vereinbaren →