Kapitel 4 · Für Super-Admins · Theme

Logo

Ihr Logo in Kopf und Startbereichen — der sichtbarste Marken-Anker.

Warum es wichtig ist

Das Logo ist das Erste, was Nutzer sehen. Es signalisiert „hier bin ich richtig“ und schafft Vertrauen. Ein unscharfes oder abgeschnittenes Logo wirkt dagegen unprofessionell.

Was es ist

Das Logo erscheint in der Kopfzeile und prägt den ersten Eindruck. Es wird im Theme hinterlegt.

So geht's konkret

So geht's konkret
  1. ÖffnenSystemTheme.
  2. Logo hochladenausreichend groß, transparenter Hintergrund.
  3. PrüfenDarstellung in Kopfzeile und mobil.

Worauf achten

  • Transparentes PNG/SVG, scharf auf allen Größen.
  • Seitenverhältnis beachten (kein Abschneiden).
  • Helligkeit: Das Logo muss auf der Kopf-Hintergrundfarbe lesbar sein — ggf. eine helle Variante nutzen.

Troubleshooting

Das Logo wird abgeschnitten oder verzerrt.

Seitenverhältnis der Datei prüfen; ein Logo mit transparentem Rand und passendem Zuschnitt hochladen.

Das Logo ist auf dunklem Header unsichtbar.

Eine helle/invertierte Logo-Variante hochladen.

Verwandtes

👉

Weiter: CI/CD & Legal-Links.

Chapter 4 · For super admins · Theme

Logo

Your logo in the header and start areas — the most visible brand anchor.

Why it matters

The logo is the first thing users see. It signals “I'm in the right place” and builds trust. A blurry or cut-off logo, by contrast, looks unprofessional.

What it is

The logo appears in the header and shapes the first impression. It is stored in the theme.

Step by step

Step by step
  1. OpenSystemTheme.
  2. Upload logolarge enough, transparent background.
  3. Checkappearance in the header and on mobile.

What to watch

  • Transparent PNG/SVG, sharp at all sizes.
  • Mind the aspect ratio (no cropping).
  • Brightness: the logo must be readable on the header background colour — use a light variant if needed.

Troubleshooting

The logo is cut off or distorted.

Check the file's aspect ratio; upload a logo with a transparent border and suitable crop.

The logo is invisible on a dark header.

Upload a light/inverted logo variant.

Related