# SaaS-Branding: ein Look für den Launch und jeden Tag danach
[Canonical HTML page](https://gradiently.design/de/guide/saas-startup-branding)
Der Launch bekommt die Aufmerksamkeit, doch eine Softwaremarke entsteht vor allem in den hundert kleinen Posts danach: Changelogs, Linkvorschauen, Doku-Header und Stellenanzeigen. Hier ist ein System, mit dem sie alle zusammenpassen.
## The short version
- SaaS-Branding ist ein kleines System aus Wortmarke, Palette, Schrift, Hintergrund-Look und einer Handvoll Layouts, das im Produkt, in der Doku und in jedem Social Post gleich angewendet wird.
- Eine SaaS-Palette muss als Interface-Farbe und als Marketing-Farbe funktionieren, also wähle einen Markenakzent, der auch als Button den Kontrast besteht.
- Jede öffentliche Seite eines SaaS-Produkts sollte ein eigenes Open-Graph-Bild in 1200×630 haben, weil Links ständig in Slack, X und LinkedIn geteilt werden.
- Changelog-Posts sind die Grafik, die ein SaaS-Team am häufigsten macht, deshalb verdienen sie eine feste Vorlage noch mehr als Launch-Grafiken.
- Recruiting-Posts sind Marken-Posts und sollten aussehen wie der Rest des Unternehmens statt wie die Vorlage eines Recruiters.
Starkes **SaaS-Branding** dreht sich weniger um die große Enthüllung am Launch-Tag als um ein kleines System, das du auf Hunderte Dinge anwenden kannst: eine Wortmarke, eine Palette, die im Interface wie auf Social Media funktioniert, eine oder zwei Schriften, ein Hintergrund-Look und ein paar feste Layouts für Launches, Changelogs, Linkvorschauen und Recruiting-Posts. Softwarefirmen liefern wöchentlich, also muss die Marke mithalten, ohne dass ein Designer alles neu zeichnet. Bau das System einmal, und jeder Post danach wird zum Lückentext.
## Ein SaaS-Markensystem in fünf Teilen
1. **Wortmarke** Dein Name, gut gesetzt in einer Schrift, dazu ein kleines quadratisches Zeichen für Favicons und App-Icons. Verzichte auf ein abstraktes Symbol, bis du weißt, dass du eines brauchst.
2. **Palette** Eine neutrale Abstufung für das Interface, ein Markenakzent und Statusfarben für Erfolg, Warnung und Fehler.
3. **Schrift** Eine Sans Serif für Interface und Marketing, optional eine Display-Schrift für große Headlines und eine Monospace für Code.
4. **Hintergrund-Look** Ein Verlauf oder Material hinter Marketing-Grafiken, nie in den Arbeitsbildschirmen des Produkts.
5. **Layouts** Feste Vorlagen für Launch-Posts, Changelog-Posts, Open-Graph-Bilder, Blog-Banner und Recruiting-Posts.
Halte sie als [Design Tokens](https://gradiently.design/de/guide/design-tokens) fest, damit Produkt und Marketing-Website dieselben Werte teilen. [Startup-Branding](https://gradiently.design/de/guide/startup-branding) behandelt Namensfindung und Positionierung; in diesem Artikel geht es darum, was du machst, sobald beides steht.
## SaaS-Farben für Produkt und Marketing
Eine SaaS-Akzentfarbe führt zwei Leben: auf Buttons und Links in der App und als Signatur jeder Marketing-Grafik. Das schließt viele modische Farben aus, weil ein Button weißen oder dunklen Text mit lesbarem Kontrast tragen muss. Wähle den Akzent zuerst für das Interface und baue dann den Marketing-Hintergrund darum herum.
- Nacht: #0b1020
- Panel: #1f2a44
- Nebel: #e5e7eb
- Markenindigo: #4f46e5
- Erfolg: #22c55e
- Warnung: #f59e0b
Eine Interface-Palette. Indigo trägt weißen Text auf Buttons und kann deshalb überall die Markenfarbe sein.
- Launch: Indigolicht auf Nacht: `radial-gradient(circle at 80% 10%, #6366f1 0%, #1f2a44 45%, #0b1020 85%)`
- Changelog: ruhiges Panel: `linear-gradient(135deg, #0b1020 0%, #1f2a44 100%)`
- Light Mode: Nebel zu Indigo: `linear-gradient(135deg, #eef2ff 0%, #c7d2fe 60%, #818cf8 100%)`
Marketing-Hintergründe aus der Interface-Palette. Produkt und Posts wirken verwandt, ohne dass die Posts wie Screenshots aussehen.
Indigo, Violett und Elektroblau sind im SaaS-Bereich extrem verbreitet; wählst du eine davon, lass den Hintergrund-Look den Unterschied machen. [Farbschema für Websites](https://gradiently.design/de/guide/website-color-scheme) behandelt die Interface-Seite, inklusive Dark Theme.
## SaaS-Grafiken zum Launch
Am Launch-Tag brauchst du eine Botschaft in mehreren Formaten: einen Querformat-Post für X und Bluesky, einen Hochformat-Post für LinkedIn, ein Linkbild für die Ankündigung und einen Hero für die Website. Sag in einer Zeile, was das Produkt tut, nicht wie es heißt.
Ein Launch-Post im Querformat mit dem Text Rechnungen, die sich selbst eintreiben, ab heute verfügbar
Der Launch-Post für X und Bluesky: zuerst, was es tut, dann der Name.
Ein LinkedIn-Launch-Post im Hochformat mit dem Text Rechnungen, die sich selbst eintreiben, ab heute verfügbar
Dieselbe Botschaft als LinkedIn-Post im Hochformat.
[Grafiken zum Launch-Tag](https://gradiently.design/de/guide/launch-day-graphics) hat eine vollständige Checkliste mit Assets und Zeitplan.
## Open-Graph-Bilder für jede Seite
SaaS-Links werden ständig in Slack, Teams, X und LinkedIn geteilt, und ohne Vorschaubild wirkt ein Link kaputt. Gib jeder öffentlichen Seite, auch Doku, Preisen, Blogartikeln und Changelog-Einträgen, ein eigenes Bild in 1200×630 mit dem Seitentitel auf deinem Hintergrund.
```html
```
Die Tags, mit denen eine Linkvorschau mit großem Bild erscheint. Nutze für das Bild eine absolute URL.
Bei vielen Seiten erzeugst du diese Bilder aus einer Vorlage statt von Hand. [Dynamische OG-Bilder](https://gradiently.design/de/guide/dynamic-og-images) zeigt, wie, und [Open-Graph-Tags](https://gradiently.design/de/guide/open-graph-tags) behandelt jedes Tag und wie jede Plattform es liest.
## Changelog- und Feature-Posts
Changelogs veröffentlicht ein SaaS-Team am häufigsten, und sie sind der beste Beweis, dass das Produkt lebt. Gib ihnen ein eigenes, ruhigeres Layout als den Launches, damit ein wöchentliches Update nicht wie ein Launch schreit und ein echter Launch trotzdem heraussticht.
Eine Changelog-Karte mit dem Text Dark Mode ist da, Changelog Woche 41, dazu schnellere Suche und drei Bugfixes
Eine Changelog-Karte in Linkvorschau-Größe: das wichtigste Feature groß, der Rest in einer Zeile.
- **Ein Feature pro Karte.** Beginne mit der Änderung, die Leute am meisten bemerken werden.
- **Ein einheitliches Label** wie „Changelog“ und eine Wochen- oder Versionsnummer.
- **Ein Screenshot oder kurzer Clip** auf der nächsten Karussellseite oder im Post selbst, nicht in die Karte gequetscht.
- **Jede Woche dasselbe Layout,** damit regelmäßige Nutzer Updates sofort erkennen.
## Recruiting-Posts, die nach dem Unternehmen aussehen
Bewerber beurteilen ein Unternehmen nach seinen Stellenanzeigen, und viele SaaS-Teams überlassen die einer generischen Vorlage. Nutze deinen eigenen Hintergrund, deine Schrift und Tonalität, nenne die Rolle klar und sag, woran die Person tatsächlich arbeiten wird. [Employer Branding gestalten](https://gradiently.design/de/guide/employer-branding-design) geht weiter.
Ein Recruiting-Post mit dem Text Wir suchen Product Designer, remote in Europa, auf demselben Hintergrund wie der Launch-Post
Rolle, Ort und die echte Arbeit, auf demselben Hintergrund wie der Launch.
## Doku, App und Social Media einheitlich halten
### Driftet ab
- Doku im Standard-Theme mit anderem Akzent
- Jede Entwicklerin baut ihr eigenes Changelog-Bild
- Blog-Banner aus einer Stock-Vorlage
- Altes Logo noch im OG-Bild
### Hält
- Doku, App und Website teilen eine Token-Datei
- Eine Changelog-Vorlage, die alle ausfüllen können
- Blog-Banner in 1200×600 auf dem Markenhintergrund
- OG-Bilder aus der aktuellen Marke erzeugt
Gradiently passt zu SaaS-Teams, die in ihrem KI-Assistenten leben. Es funktioniert in ChatGPT, Claude und jedem Assistenten, der Remote-MCP-Server unterstützt, also kannst du die Changelog-Karte dieser Woche im selben Chat anfordern, in dem du die Release Notes geschrieben hast, und das Design öffnet sich im Studio in deinem Branding zum Prüfen und Exportieren. [KI-Assistenten verbinden](https://gradiently.design/de/guide/connect-ai-assistant) erklärt die Einrichtung.
## FAQ
### Was macht gutes SaaS-Branding aus?
Ein kleines, einheitliches System: eine Wortmarke, eine Palette für Interface und Marketing, eine oder zwei Schriften, ein Hintergrund-Look und feste Layouts für wiederkehrende Posts.
### Welche Größe sollte ein Open-Graph-Bild für SaaS haben?
1200×630 Pixel. Gib jeder öffentlichen Seite ein eigenes Bild und nutze eine absolute URL im og:image-Tag.
### Welche Farben sollte eine SaaS-Marke nutzen?
Eine neutrale Interface-Abstufung, einen Markenakzent, der als Button-Farbe den Kontrast besteht, und klare Statusfarben für Erfolg, Warnung und Fehler.
### Wie sollte ein SaaS-Unternehmen Changelog-Posts gestalten?
Mit einer ruhigen, festen Vorlage mit klarem Label und Versions- oder Wochennummer, die mit der einen Änderung beginnt, die Nutzer am meisten bemerken.
### Brauchen SaaS-Startups ein Logo-Symbol?
Anfangs nicht. Eine gut gesetzte Wortmarke plus ein schlichtes quadratisches Zeichen für Favicons und App-Icons reicht für die meisten frühen Produkte.