> For the complete documentation index, see [llms.txt](https://one-loop.gitbook.io/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/formulare-und-umfragen/interaktive-farben-in-formularen-umfragen-und-quizzen-festlegen.md).

# Interaktive Farben in Formularen, Umfragen und Quizzen festlegen

Lege die Hauptfarbe für Eingabefelder, Auswahlfelder und weitere Interaktionen fest und prüfe die Wirkung auf allen Formularen, Umfragen und Quizzen.

## Das Ergebnis

Die Hauptfarbe steuert, wie interaktive Elemente reagieren: etwa der Rand eines aktiven Eingabefelds, ausgewählte Kontrollkästchen, Optionsfelder, Listen und Datumsfelder. So erkennen Besucherinnen und Besucher besser, wo sie gerade klicken oder schreiben. Die Einstellung gilt für die Formulare, Umfragen und Quizze, die die Standardgestaltung verwenden.

Die Hauptfarbe ist nicht automatisch die Buttonfarbe. Du entscheidest separat, ob Schaltflächen denselben Farbton übernehmen sollen.

## Hauptfarbe einstellen

1. Öffne ein Formular, eine Umfrage oder ein Quiz im Editor.
2. Öffne oben rechts das **Einstellungs-Symbol** mit den Schiebereglern.
3. Wähle im rechten Bereich **Stile**.
4. Scrolle zum Bereich **Farben und Hintergrund**.
5. Klicke auf **Hauptfarbe**. Der Eintrag **Standard** bedeutet, dass noch keine eigene Hauptfarbe festgelegt ist.
6. Wähle einen Farbton im Farbfeld oder gib einen gültigen **HEX- beziehungsweise HEXA-Wert** ein. Nutze bei Bedarf den Regler für die Deckkraft; eine deutlich sichtbare Farbe erleichtert das Erkennen aktiver Felder.
7. Aktiviere die Zuordnung zur Buttonfarbe nur, wenn Buttons denselben Farbton verwenden sollen.
8. Speichere die Änderung und prüfe sofort die Vorschau.

Ohne festgelegte Hauptfarbe verwendet die Oberfläche eine neutrale Standarddarstellung.

## Wo die Hauptfarbe sichtbar wird

Der gewählte Farbton wird bei Interaktionen verwendet, zum Beispiel:

* wenn ein Eingabefeld berührt, angeklickt oder beschrieben wird;
* wenn eine Auswahlliste geöffnet oder eine Option gewählt wird;
* wenn ein Kontrollkästchen oder Optionsfeld ausgewählt wird;
* wenn ein Datum ausgewählt wird;
* bei Rahmen von Datei-Uploads und bei Zeichenbereichen.

Diese Effekte sind fest eingebaut und lassen sich nicht einzeln ausschalten. Sie verbessern die Orientierung, besonders auf kleineren Bildschirmen.

## Wirkung vor der Veröffentlichung prüfen

1. Öffne die Vorschau auf Desktop und Mobilgerät.
2. Klicke in jedes relevante Eingabefeld und wähle mindestens eine Option aus.
3. Prüfe Kontrast von Hauptfarbe, Hintergrund und Text.
4. Kontrolliere, ob eine abweichende Buttonfarbe weiterhin verständlich wirkt.
5. Sende eine Testeinsendung ab.

Änderst du die Hauptfarbe, können Formulare mit der Standardgestaltung automatisch den neuen Farbton verwenden. Einzelne abweichende Farben pro Formular werden für diese Einstellung nicht angeboten. Plane die Änderung daher als standortweite Gestaltungsvorgabe.

## Praxisbeispiel

Ein Betrieb verwendet eine dunkle Hauptfarbe für aktive Felder und lässt die Buttons bewusst in einem helleren Akzentton. Im Test klickt das Team auf Auswahlfelder, den Kalender und die Upload-Fläche. Es stellt fest, dass der dunkle Ton auf einem schwarzen Hintergrund nicht klar genug ist und wählt einen helleren, kontrastreichen Wert. Erst danach veröffentlicht es die Änderung.

## Häufige Fehler

### Die Farbe wirkt nur an einigen Stellen

Die Hauptfarbe zeigt sich erst bei Interaktionen. Klicke oder tippe im Test in das Feld, statt nur die ruhende Ansicht zu prüfen.

### Eine einzelne Form soll abweichen

Die Hauptfarbe ist als gemeinsame Gestaltung für Standardformulare gedacht. Prüfe, ob ein separates Theme oder bewusst abweichende Stilregeln für den Einzelfall besser passen.

### Buttons haben die falsche Farbe

Kontrolliere die Einstellung, die Hauptfarbe auf Buttons zu übertragen. Sie ist optional und kann ausgeschaltet bleiben.

## Gespeicherte Markenfarben im Farbwähler nutzen

Neben einer manuell gewählten Hauptfarbe kannst du in Formularen, Umfragen und Quizzen gespeicherte Markenfarben direkt im Farbwähler verwenden. Dadurch muss das Team einen Farbcode nicht bei jedem Element neu eingeben.

### Voraussetzung

In den Markeneinstellungen muss eine Markenpalette mit Farben hinterlegt sein; außerdem muss die passende Palette als Standard ausgewählt sein. Fehlt der Bereich **Markenfarben** im Farbwähler, prüfst du zuerst diese beiden Einstellungen.

### Farbe auswählen

1. Öffne das Formular, die Umfrage oder das Quiz im Editor.
2. Wähle das Element oder die Stil-Einstellung, dessen Farbe du ändern möchtest.
3. Öffne das zugehörige Farbfeld.
4. Wähle im Farbwähler **Markenfarben**, **globale eigene Farben** oder eine Standardfarbe.
5. Klicke auf die gewünschte gespeicherte Farbe und prüfe die Vorschau.
6. Speichere und teste die Darstellung auf Desktop und Mobilgerät.

Über **Verwalten** im Farbwähler öffnest du die Markeneinstellungen, um weitere wiederverwendbare Farben anzulegen oder zu ordnen. Markenfarben stammen aus der festgelegten Palette; globale eigene Farben sind zusätzlich gespeicherte Farben für unterstützte Farbwähler.

Eine Änderung der Standard-Markenpalette gestaltet vorhandene Formulare, Umfragen und Quizze nicht rückwirkend um. Bereits gespeicherte Farben bleiben bestehen, bis du sie im jeweiligen Element bewusst ersetzt.

> **Praxisbeispiel:** Ein Team ergänzt eine neue Akzentfarbe in seinen Markeneinstellungen. Beim Überarbeiten eines Anmeldeformulars wählt es für die Schaltfläche diese gespeicherte Farbe im Farbwähler, prüft den Kontrast und speichert erst nach dem Mobiltest. Bestehende Formulare werden dadurch nicht unbeabsichtigt verändert.