---
title: "Anpassung von Callouts"
slug: "callout-styles"
updated: 2026-06-22T08:42:59Z
published: 2026-06-22T08:42:59Z
canonical: "docs.document360.com/callout-styles"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.document360.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Anpassung von Callouts

Document360 bietet vier integrierte Callout-Typen – Info, Warnung, Fehler und Erfolg – jeweils mit einer eigenen Standardfarbe. Der CSS-Ausschnitt Change **Callout Colors** erlaubt es dir, diese Standardfarben zu überschreiben, um sie an deine Markenpalette anzupassen. Farbänderungen gelten global in deiner gesamten Wissensdatenbank – alle Aufrufe desselben Typs werden gleichzeitig aktualisiert.

---

## Callout-Typen

| Typ | Standardfarbe | Zweck |
| --- | --- | --- |
| **Informationen** | Blau | Zusätzlicher Kontext, hilfreiche Tipps oder ergänzende Informationen |
| **Warnung** | Gelb | Potenzielle Probleme, wichtige Überlegungen oder Handlungen mit unbeabsichtigten Folgen |
| **Fehler** | Rot | Bekannte Fehler, Fehlerzustände oder Aktionen, die vermieden werden müssen |
| **Erfolg** | Grün | Abgeschlossene Schritte, positive Ergebnisse oder empfohlene Konfigurationen |

1. **Informationen**

Dein Titel gehört hier

Ihr Inhalt kommt hier

1. **Warnung**

Dein Titel gehört hier

Ihr Inhalt kommt hier

1. **Fehler**

Dein Titel gehört hier

Ihr Inhalt kommt hier

1. **Erfolg**

> [!TIP]
> **Dein Titel gehört hier**
> 
> 
> Ihr Inhalt kommt hier

---

## Wie man Callout-Farben individuell anpasst

1. Navigieren Sie zu  () > **Knowledge base site** in der linken Navigationsleiste des Knowledge Base-Portals.
2. Im linken Navigationsfenster navigieren Sie zur **Site-Anpassung**.

![Site customization page showing the Custom CSS and JavaScript option](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Site_Customization_Custom_CSS&JavaScript.png)

1. Klicken Sie **auf benutzerdefiniertes CSS & JavaScript**.
2. Wähle den **CSS-Tab** und klicke dann rechts **auf "Code Snippets hinzufügen** ".

Das **Panel "Code hinzufügen" erscheint** .

![Add code snippets panel showing the Change callout colors option](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1771842590625.png)

1. Wähle **Callout-Farben ändern**. Der Snippet wird in den CSS-Editor eingefügt und zeigt die vorhandenen Farbwerte für alle vier Callout-Typen.
2. Bearbeiten Sie die Farbwerte im Code, um Ihre Markenfarben anzuwenden.
3. Klicken **Sie auf Speichern**.

![CSS editor showing the Change callout colors snippet with color values for Info, Warning, Error, and Success callouts](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1771842608522.png)

Die aktualisierten Farben werden auf alle Aufrufe jedes Typs in der gesamten Wissensdatenbank angewendet.

---

## Best Practices

- **Vorschau sowohl im hellen als auch im Dunkelmodus** – Farben, die im hellen Modus gut aussehen, können im Dunkelmodus Kontrast- oder Lesbarkeitsprobleme haben. Immer beide nach dem Speichern überprüfen.
- **Ändere die Farben global, nicht pro Callout** – der Snippet aktualisiert alle Callouts eines bestimmten Typs gleichzeitig. Wenn du eine einmalige Farbe brauchst, verwende stattdessen Inline-CSS im Artikel.
- **Halte den Zweck des Callouts mit der Farbe abgestimmt** – vermeide es, Farben zu verwenden, die mit der Bedeutung des Callouts kollidieren. Zum Beispiel kann die Verwendung von Rot für einen Info-Aufruf die Leser verwirren.

---

## FAQ

**Kann ich Callout-Farben im Dunkelmodus stylen?**

Ja. Weitere Informationen finden Sie unter [Wie man die Farbe der Callouts im Dunkelmodus ändert](https://docs.document360.com/docs/de/how-to-change-the-callouts-color-in-dark-mode).

**Kann ich die Farbe eines einzelnen Callouts ändern, ohne alle anderen gleichen Typs zu beeinflussen?**

Nein. Der Ausschnitt "Wechsel die Farben ändern" gilt global für alle Aufrufe desselben Typs in der gesamten Wissensdatenbank. Individuelle Callout-Farbüberschreibungen werden im Snippet nicht unterstützt – für einmalige Änderungen müsstest du direkt Inline-CSS zum Artikel hinzufügen.