Wie passe ich Farben und Logo an?

Ab Tarif Basic

Kurzantwort

Öffne Verwaltung → Branding: Dort lädst du Logo und Favicon hoch, setzt den Site-Name (Browser-Tab) und wählst Primärfarbe und Sekundärfarbe als Hex-Werte. Die Primärfarbe wirkt UI-weit: auf Buttons, Links und aktive Navigation. Notory berechnet daraus automatisch hellere/dunklere Hover- und Aktiv-Töne sowie eine kontrastsichere Textfarbe (WCAG-orientiert). Die Sekundärfarbe prägt die Seitenleiste samt Hover-Zustand.

Voraussetzungen

Bilder: PNG, JPEG, SVG, WEBP, ICO oder GIF, bis zur konfigurierten Upload-Obergrenze. Farben: Hex-Notation #RGB oder #RRGGBB.

Branding öffnen. Verwaltung → Branding („Logo, Site-Name (Browser-Tab) und Server-Name für diese Instanz festlegen.”).

Screenshot ausstehend admin-branding-01 Branding-Bereich mit Logo-Upload, Site-Name, Server-Name sowie Primär- und Sekundärfarbe

Der Branding-Bereich: Logo, Site-Name und die beiden Markenfarben der Instanz.
Logo und Favicon hochladen. Klicke „Logo hochladen” und wähle die Datei; das Favicon analog. Das alte Bild wird dabei automatisch ersetzt.
Namen und Farben setzen. Trage Site-Name (erscheint im Browser-Tab und in E-Mails) und ggf. Server-Name ein. Wähle Primärfarbe und Sekundärfarbe über den Farbwähler oder als Hex-Wert. Optional: eine Login-Nachricht, die auf der Anmeldeseite erscheint, und das Standard-Theme (Dark, Light oder Notory).
Speichern. Die Änderungen greifen sofort, auch auf der Login-Seite, noch vor der Anmeldung.

Branding liegt in den Instanz-Einstellungen. Lesen ist öffentlich (die Login-Seite braucht es vor der Anmeldung), Schreiben erfordert Administrator-Rechte:

curl https://demo.notory.io/api/v1/instance/settings

curl -X PUT https://demo.notory.io/api/v1/instance/settings \
  -H "Authorization: Bearer inv_dein_token" \
  -H "Content-Type: application/json" \
  -d '{
    "site_name": "ACME Inventar",
    "server_name": "ACME Notory Server",
    "primary_color": "#c6703d",
    "secondary_color": "#15161a",
    "login_message": "Willkommen im ACME-Inventar. Support: it@acme.example",
    "default_theme": "dark"
  }'

curl -X POST https://demo.notory.io/api/v1/instance/logo \
  -H "Authorization: Bearer inv_dein_token" \
  -F "file=@acme-logo.svg;type=image/svg+xml"

Analog: POST /api/v1/instance/favicon. Mandanten-Branding setzt du separat:

curl -X PUT https://demo.notory.io/api/v1/tenants/{tenant_id}/branding \
  -H "Authorization: Bearer inv_dein_token" \
  -H "Content-Type: application/json" \
  -d '{ "logo_url": "https://acme.example/logo.svg", "primary_color": "#1B3A5C", "secondary_color": "#ffffff" }'

Mögliche Fehler: 403 (kein Administrator / Scope write fehlt), 413 (Datei zu groß), 415 (nicht unterstützter Bildtyp, erlaubt: PNG, JPEG, SVG, WEBP, ICO, GIF), 422 (ungültiger Hex-Wert, Muster #RGB/#RRGGBB).

Was passiert dabei?

Farb-Ableitung UI-weit. Aus der Primärfarbe erzeugt das Frontend automatisch eine hellere (+12 %) und eine dunklere Variante (−12 %) für Hover-/Aktiv-Zustände und berechnet eine WCAG-orientierte Kontrast-Textfarbe (hell oder dunkel), damit Text auf Buttons in Markenfarbe lesbar bleibt. Die Sekundärfarbe bestimmt den Hintergrund der Seitenleiste, ihr Hover-Ton wird ebenfalls abgeleitet (+10 %). Du pflegst also zwei Werte. Notory kümmert sich um alle Zustände und Kontraste.
Wirkung vor dem Login. GET /api/v1/instance/settings ist bewusst öffentlich: Browser-Tab-Titel, Logo, Farben und Login-Nachricht erscheinen schon auf der Anmeldeseite. Speichere hier deshalb nichts Vertrauliches.
Auch E-Mails sind gebrandet. System-Mails (Reset-Link, Einladung) übernehmen Site-Name, Logo und Primärfarbe sowie die Footer-Rechtslinks.
Uploads landen in der Datenbank. Logo/Favicon werden im Medienspeicher der Datenbank abgelegt (nicht im Dateisystem). So liefern auch mehrere Backend-Replikate dasselbe Bild aus. Beim Ersetzen wird das alte Medium gelöscht.
Zwei Ebenen Branding. Das Instanz-Branding gilt überall; zusätzlich kann jeder Mandant eigenes Logo und eigene Farben führen, die für dessen Benutzer das Instanz-Branding überlagern.
Audit. Jede Änderung vermerkt updated_by (wer zuletzt geändert hat) und erscheint im Protokoll.