> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/experience-components/ax-separator.md).

# AX - Trennlinie

## Übersicht

**AX - Trennlinie** ist eine Experience-Cloud-Komponente, die visuelle Trennlinien zwischen Inhaltsabschnitten auf Experience-Sites-Seiten erstellt.

Verwenden Sie sie, um horizontale Linien, Abstände oder visuelle Trennungen zwischen Komponenten hinzuzufügen und so die Seitenorganisation und Lesbarkeit zu verbessern. Konfigurieren Sie in Experience Builder den Stil, die Farbe, die Dicke und den Abstand der Trennlinie.

Perfekt zum Trennen von Formularabschnitten, zum Abgrenzen von Inhaltsblöcken, zum Organisieren langer Seiten oder überall dort, wo Ihr Portal eine klare visuelle Trennung zwischen verschiedenen Inhaltsbereichen benötigt.

## Einstellungen

{% tabs %}
{% tab title="🎛️ Eigenschaften" %}

| Name                                | Beschreibung                                                                                                                                                                                                     | Verwendung                                                                                                                                                                                              |
| ----------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Titel**                           | Der Text wird neben der Trennlinie angezeigt, um Kontext oder zusätzliche Informationen bereitzustellen.                                                                                                         | Verwenden Sie diese Eigenschaft, um die Abschnitte zu beschriften, die die Trennlinie voneinander trennt, und so das Verständnis der Benutzer zu verbessern.                                            |
| <h4>Symbolname und Symbolgröße</h4> | Fügen Sie ein Symbol hinzu, das zusammen mit der Trennlinie für zusätzlichen visuellen Kontext angezeigt wird. Die Größe des Symbols kann ebenfalls angepasst werden, um den Designanforderungen zu entsprechen. | Verwenden Sie Symbole als visuelle Hinweise, die den Titel ergänzen oder den folgenden Inhalt kennzeichnen und so zur kommunikativen Funktion der Trennlinie beitragen.                                 |
| **Inhalt ausrichten**               | Legen Sie die Position von Titel und Symbol zur Trennlinie fest. Optionen sind **`Start`**, **`Ende`**, oder **`Zentriert`**`.`                                                                                  | Richten Sie den Inhalt entsprechend dem Layout und der vom Design geforderten Hervorhebung aus, damit sich die Trennlinie nahtlos in den Seitenfluss einfügt.                                           |
| **Ausrichtung**                     | Legen Sie die Ausrichtung der Trennlinie auf **`Horizontal`** oder **`Vertikal`**, und bietet Flexibilität bei der Aufteilung des Inhalts.                                                                       | Wählen Sie die passende Ausrichtung, die am besten zum Layout Ihrer Inhalte passt – egal, ob es sich um einen Vergleich nebeneinander oder eine Aufteilung in einen oberen und unteren Bereich handelt. |
| {% endtab %}                        |                                                                                                                                                                                                                  |                                                                                                                                                                                                         |

{% tab title="🎨 Gestaltung" %}

| Name          | Beschreibung                                                                                                                                                 | Verwendung                                                                                                                                                                          |
| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Titel**     | Passen Sie das Erscheinungsbild des Titels mit Optionen für Farbe, Schriftgröße, Stil und Schriftstärke an.                                                  | Gestalten Sie den Titel so, dass er angemessen hervorsticht und die Konsistenz mit dem gesamten Designkonzept der Website wahrt.                                                    |
| **Symbol**    | Gestalten Sie das Symbol mit Hintergrundfarbe, Vordergrundfarbe, einem Standardzustand für die Vordergrundfarbe und dem Symbolradius für abgerundete Kanten. | Verfeinern Sie das Erscheinungsbild des Symbols, um es auffälliger oder dezenter zu machen und an den Designzielen auszurichten.                                                    |
| **Rahmen**    | Definieren Sie den Rahmen der Trennlinie, indem Sie Größe, Farbe und Stil (durchgezogen, gestrichelt, gepunktet und mehr) festlegen.                         | Passen Sie die Rahmeneinstellungen an, um den gewünschten Grad an Abgrenzung zwischen Inhaltsabschnitten zu erzielen – von einer deutlichen Linie bis zu einer subtileren Trennung. |
| {% endtab %}  |                                                                                                                                                              |                                                                                                                                                                                     |
| {% endtabs %} |                                                                                                                                                              |                                                                                                                                                                                     |


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/experience-components/ax-separator.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.