Interne Referenz

Design-System

Verbindliche Quelle für Tokens und Komponenten. Was hier nicht steht, wird nicht gebaut — und keine Komponente definiert eigene Farb- oder Abstandswerte.

Farben

Warmes Neutral als Grundlage, eine Akzentfarbe, vier Statustöne. Farbe ist Signal, nie Dekoration — und nie der alleinige Bedeutungsträger.

Flächen

canvas
surface
sunken
hover
active

Linien

line-subtle
line
line-strong

Text

text-primary — Fließtext und Werte

text-secondary — Beschriftungen

text-tertiary — Zusatzangaben

text-disabled — inaktiv

Akzent — Immergrün

accent
accent-surface
accent-line

accent-text — Verweise und Betonung

Status

success-surface
warning-surface
danger-surface
info-surface
neutral-surface

Typografie

Newsreader für Titel und große Zahlen, IBM Plex Sans für die Oberfläche, IBM Plex Mono für IDs, Zeitangaben und technische Kennzeichnungen. UI-Basisgröße ist 14 px — dies ist ein Arbeitswerkzeug, kein Textdokument.

display-lg / 40

1.240.000 €

display / 28

Anfragen des Tages

title / 22

3-Zimmer-Wohnung, Prenzlauer Berg

reading / 15

Fließtext für längere Passagen, etwa Antwortentwürfe und Erklärungen.

base / 14

Oberflächentext, Standardgröße.

sm / 13

Tabellenzellen und Nebeninformation.

overline / 11

Abschnittsbeschriftung

mono / 12

LEAD-2026-0834 · 11:24 MESZ

Form & Bewegung

Radius maximal 6 px. Schatten ausschließlich für echte Überlagerungen — dadurch behält „schwebt“ eine verlässliche Bedeutung. Bewegung ist kurz, gerichtet und respektiert prefers-reduced-motion.

Radius

xs · 2
sm · 3
md · 4
lg · 6

Schatten

shadow-pop
shadow-dialog

Schaltflächen

Varianten

Größen

Zustände

Formulare

Label, Hinweis, Eingabe und Fehlermeldung sind über IDs verbunden. Fehlermeldungen sagen, was zu tun ist.

Erscheint in Anfragen und im Antwortentwurf.

Auswahl

Status & Etiketten

In einer Liste mit 200 Zeilen erzeugen gefüllte Farbpillen eine Farbwand. Der Punkt trägt das Signal, der Text die Bedeutung.

Status

NeuKontaktiertQualifiziertWartet auf FreigabeBesichtigung bestätigtVersand fehlgeschlagen

Etiketten

7 offenKIÜberfälligArchiv

Schlagwörter

KapitalanlegerErstbezug

Personen & Tasten

K

Tabelle

Kein Zebrastreifen, keine vertikalen Linien, keine gefüllte Kopfzeile. Struktur entsteht durch Ausrichtung. Zahlen stehen rechtsbündig und tabellarisch.

InteressentObjektStatusEingang
Anna MüllerKastanienallee 12Wartet auf Freigabe11:24
Tobias FehrenbachRykestraße 4Qualifiziert10:57
Yusuf DemirKastanienallee 12Besichtigung bestätigt09:03
Claudia HoffmannGreifswalder Str. 88Neu08:41

Überlagerungen

Dialog für Entscheidungen, Drawer für Details ohne Verlust des Listenkontexts, Menü für Aktionen, Toast für abgeschlossene Vorgänge.

Auslöser

Zustände

Leer, ladend, verarbeitend. Ein Fortschrittsbalken für KI-Verarbeitung wäre eine erfundene Angabe — stattdessen wird benannt, was gerade läuft.

Leer

Keine offenen Anfragen

Alle eingegangenen Anfragen sind bearbeitet. Neue erscheinen hier automatisch.

Lädt

Objekte werden geladen

Verarbeitung

Objekt wird zugeordnet
Antwortentwurf wird erstellt

KI-Komponenten

KI hat in diesem Produkt keine eigene Farbe und kein eigenes Symbol. Herkunft wird typografisch markiert. Statt einer erfundenen Prozentzahl wird benannt, worauf ein Ergebnis beruht.

Antwort an Anna Müller

Kastanienallee 12 · eingegangen 11:24

Belegt· Objekt-ID aus Portal-AnfrageWahrscheinlich· Wunschtermin aus FreitextUnsicher· Haushaltsgröße nicht genannt
Antwortentwurf11:24

Guten Tag Frau Müller, vielen Dank für Ihre Anfrage zur Wohnung in der Kastanienallee 12. Die Wohnung ist weiterhin verfügbar. Für eine Besichtigung kann ich Ihnen Dienstag, 18. August, 17:30 Uhr anbieten. Passt Ihnen der Termin? Mit freundlichen Grüßen

Grundlage: Objektdaten · Vorlage Besichtigung · Verfügbarkeit Kalender

Bewertung dieser Anfrage

  • Konkreter Besichtigungswunsch mit zwei Terminvorschlägen
  • Einzugstermin passt zur Verfügbarkeit ab 1. Oktober
  • Objekt eindeutig über die Portal-Kennung zugeordnet
  • Keine Angabe zur Haushaltsgröße
  • Anfrage über ImmoScout24 eingegangen

Nichts wird ohne Ihre Freigabe versendet. Angaben zu Preis, Fläche und Verfügbarkeit stammen ausschließlich aus den hinterlegten Objektdaten.

Weitere Objekte

Rykestraße 4