Aussehen

Im Aussehen-Tab gestaltest du das visuelle Design deines Chats. Du kannst Farben anpassen, Bubble-Stile wählen und vorgefertigte Vorlagen nutzen.

Light und Dark Mode

Der Chat unterstützt separate Farben für Light und Dark Mode. Oben im Tab findest du einen Toggle zum Wechseln:

Modus	Beschreibung
Hell	Farben für den Light Mode (Standard)
Dunkel	Farben für den Dark Mode

Beide Modi konfigurieren

Tippe auf den Toggle, um zwischen den Modi zu wechseln. Konfiguriere beide, da Nutzer in ihren Systemeinstellungen zwischen Light und Dark Mode wechseln können.

---

App-Design übernehmen

Übernimm automatisch die Farben aus deinem globalen App-Theme:

1. Tippe auf App-Design übernehmen oben im Aussehen-Tab
2. Die Farben aus der Theme Suite werden auf den Chat angewendet
3. Sowohl Light als auch Dark Mode werden aktualisiert

Was übernommen wird:

• Hintergrundfarbe aus dem App-Hintergrund
• Eigene Bubble in Primärfarbe
• Partner-Bubble in Oberflächenfarbe
• Textfarben passend zum Kontrast
• Eckenradius aus dem Theme

---

Farben

Chat-Hintergrund

Was es macht: Die Hintergrundfarbe des gesamten Chat-Bereichs.

So findest du es: Aussehen > Farben > Chat-Hintergrund

Standard-Werte:

Modus	Farbe
Hell	Beige (#ECE5DD) - wie WhatsApp
Dunkel	Sehr dunkel (#121212)

Auswirkung:

• Bildet den Hintergrund hinter allen Nachrichten
• Sollte gut mit den Bubble-Farben kontrastieren

---

Eigene Bubble

Was es macht: Die Hintergrundfarbe deiner eigenen Nachrichten-Bubbles.

So findest du es: Aussehen > Farben > Eigene Bubble

Standard-Werte:

Modus	Farbe
Hell	Hellgrün (#DCF8C6) - wie WhatsApp
Dunkel	Dunkelgrün (#005C4B)

Auswirkung:

• Hebt eigene Nachrichten visuell hervor
• Erscheint auf der rechten Seite (bei aktivierter Ausrichtung)

Empfehlung

Wähle eine Farbe, die sich deutlich vom Hintergrund und den Partner-Bubbles unterscheidet.

---

Eigener Text

Was es macht: Die Textfarbe in deinen eigenen Nachrichten.

So findest du es: Aussehen > Farben > Eigener Text

Standard-Werte:

Modus	Farbe
Hell	Schwarz (#000000)
Dunkel	Weiß (#FFFFFF)

Auswirkung:

• Muss gut auf der eigenen Bubble lesbar sein
• Wird automatisch bei Vorlagen angepasst

---

Partner Bubble

Was es macht: Die Hintergrundfarbe der Nachrichten vom Chat-Partner.

So findest du es: Aussehen > Farben > Partner Bubble

Standard-Werte:

Modus	Farbe
Hell	Weiß (#FFFFFF)
Dunkel	Dunkelgrau (#1F2C34)

Auswirkung:

• Erscheint auf der linken Seite (bei aktivierter Ausrichtung)
• Sollte sich von eigenen Bubbles unterscheiden

---

Partner Text

Was es macht: Die Textfarbe in Partner-Nachrichten.

So findest du es: Aussehen > Farben > Partner Text

Standard-Werte:

Modus	Farbe
Hell	Schwarz (#000000)
Dunkel	Hellgrau (#E0E0E0)

---

Zeitstempel

Was es macht: Die Farbe der Zeitangaben unter Nachrichten.

So findest du es: Aussehen > Farben > Zeitstempel

Standard-Werte:

Modus	Farbe
Hell	Grau (#8E8E93)
Dunkel	Hellgrau (#9E9E9E)

Auswirkung:

• Zeitstempel sollten dezent, aber lesbar sein
• Erscheinen neben dem Zustellstatus

---

Eingabefeld

Farben für die Eingabeleiste am unteren Bildschirmrand.

Eingabefeld-Hintergrund

Was es macht: Die Hintergrundfarbe der Eingabeleiste.

So findest du es: Aussehen > Eingabefeld > Eingabefeld-Hintergrund

Standard-Werte:

Modus	Farbe
Hell	Weiß (#FFFFFF)
Dunkel	Dunkelgrau (#1E1E1E)

---

Eingabe-Text

Was es macht: Die Textfarbe im Eingabefeld.

So findest du es: Aussehen > Eingabefeld > Eingabe-Text

Standard-Werte:

Modus	Farbe
Hell	Schwarz (#000000)
Dunkel	Hellgrau (#E0E0E0)

---

Senden-Button

Was es macht: Die Farbe des Senden-Buttons.

So findest du es: Aussehen > Eingabefeld > Senden-Button

Standard-Werte:

Modus	Farbe
Hell	WhatsApp-Grün (#25D366)
Dunkel	Primärfarbe aus Theme

Auswirkung:

• Der runde Button rechts in der Eingabeleiste
• Sollte auffällig und gut erkennbar sein

---

Bubble-Stil

Diese Einstellungen sind nur im Light Mode sichtbar, gelten aber für beide Modi.

Bubble-Form

Was es macht: Die Form der Nachrichtenblasen.

So findest du es: Aussehen > Bubble-Stil > Bubble-Form

Optionen:

Form	Beschreibung
Abgerundet	Gleichmäßig runde Ecken - wie iMessage
Eckig	Keine Rundungen - sehr minimalistisch
Modern	Asymmetrisch gerundet - wie WhatsApp

Beispiele:

• Abgerundet: Klassischer Chat-Look, alle Ecken gleich rund
• Eckig: Schlicht und modern, für minimalistisches Design
• Modern: Eigene Bubble hat spitze Ecke unten-rechts, Partner unten-links

---

Eckenradius

Was es macht: Stärke der Rundung bei den Bubble-Ecken.

So findest du es: Aussehen > Bubble-Stil > Eckenradius

Einstellungen:

Wert	Aussehen
0 px	Komplett eckig
8 px	Leicht gerundet
16 px	Standard (wie WhatsApp)
24 px	Stark gerundet
30 px	Sehr rund

Standard: 16 px

Gut zu wissen

Der Eckenradius wirkt nur bei “Abgerundet” und “Modern”. Bei “Eckig” wird er ignoriert.

---

Avatar-Anzeige

Was es macht: Ob und wo Profilbilder neben Nachrichten erscheinen.

So findest du es: Aussehen > Bubble-Stil > Avatar-Anzeige

Optionen:

Option	Beschreibung
Keine	Keine Avatare im Chat
Nur Partner	Nur der Partner zeigt sein Profilbild
Alle	Beide Seiten zeigen Avatare

Standard: Nur Partner

Auswirkung:

• Avatare erscheinen neben der ersten Nachricht einer Person
• Kleine runde Profilbilder am Rand der Bubbles

---

Bubbles ausrichten

Was es macht: Positioniert Bubbles am Rand.

So findest du es: Aussehen > Bubble-Stil > Bubbles ausrichten

Optionen:

Einstellung	Wirkung
An	Eigene Bubbles rechts, Partner-Bubbles links
Aus	Alle Bubbles am linken Rand

Standard: An

Empfehlung

Lass diese Option aktiviert. Die meisten Chat-Apps verwenden diese Ausrichtung, und Nutzer erwarten sie.

---

Vorlagen

Der Chat-Editor bietet fünf vorgefertigte Design-Vorlagen.

WhatsApp-Stil

Farben:

Element	Light	Dark
Hintergrund	Beige (#ECE5DD)	Dunkelblau (#0B141A)
Eigene Bubble	Grün (#DCF8C6)	Dunkelgrün (#005C4B)
Partner Bubble	Weiß	Dunkelgrau (#1F2C34)

Bubble-Stil: Modern

---

iMessage-Stil

Farben:

Element	Light	Dark
Hintergrund	Weiß	Schwarz
Eigene Bubble	Blau (#007AFF)	Hellblau (#0A84FF)
Partner Bubble	Hellgrau (#E5E5EA)	Dunkelgrau (#3A3A3C)

Bubble-Stil: Abgerundet

---

Telegram-Stil

Farben:

Element	Light	Dark
Hintergrund	Hellgrau (#E6EBEE)	Dunkelblau (#0E1621)
Eigene Bubble	Hellblau (#64B5F6)	Violett (#766AC8)
Partner Bubble	Weiß	Dunkelblau (#182533)

Bubble-Stil: Abgerundet

---

Minimal

Farben:

Element	Light	Dark
Hintergrund	Weiß	Dunkel (#121212)
Eigene Bubble	Schwarz	Weiß
Partner Bubble	Hellgrau (#F5F5F5)	Dunkelgrau (#2C2C2C)

Bubble-Stil: Eckig

---

Dunkel

Farben:

Element	Light & Dark
Hintergrund	Dunkel (#212121)
Eigene Bubble	Violett (#5C6BC0)
Partner Bubble	Grau (#424242)

Bubble-Stil: Abgerundet

Gut zu wissen

Das “Dunkel”-Template verwendet dieselben Farben für Light und Dark Mode.

---

Alle Farb-Einstellungen

Einstellung	Bereich	Standard (Light)	Standard (Dark)
Chat-Hintergrund	Farben	#ECE5DD	#121212
Eigene Bubble	Farben	#DCF8C6	#005C4B
Eigener Text	Farben	#000000	#FFFFFF
Partner Bubble	Farben	#FFFFFF	#1F2C34
Partner Text	Farben	#000000	#E0E0E0
Zeitstempel	Farben	#8E8E93	#9E9E9E
Eingabefeld	Eingabefeld	#FFFFFF	#1E1E1E
Eingabe-Text	Eingabefeld	#000000	#E0E0E0
Senden-Button	Eingabefeld	#25D366	#1976D2

---

Tipps

Kontrast prüfen

Stelle sicher, dass Text auf den Bubble-Farben gut lesbar ist. Helle Bubbles brauchen dunklen Text und umgekehrt.

Vorlage als Basis

Starte mit einer Vorlage und passe dann einzelne Farben an. Das spart Zeit und sorgt für ein harmonisches Design.

App-Design übernehmen

Wenn du bereits ein schönes Theme in der Theme Suite erstellt hast, nutze “App-Design übernehmen” für ein konsistentes Erscheinungsbild.

Modern für WhatsApp-Look

Der “Modern”-Bubble-Stil mit asymmetrischen Ecken ist der authentischste WhatsApp-Look.

Dark Mode testen

Wechsle in den Dark Mode und prüfe alle Farben. Viele Nutzer verwenden Dark Mode, besonders abends.