# Divider

A simple horizontal line for separating sections of a page. Use Divider when whitespace alone isn't enough to break up content — for example, between major sections of a long form or between groups of cards.

## Available in

* All module types

## When to use

* Between major sections of a page where you want a clear visual break.
* After a heading group when the next section is unrelated content.
* Inside a card or panel to separate header from body.

For consistent spacing without a line, use **Space** instead. For complex layout breaks, use **Row** + **Column**.

## Settings

| Setting             | Description                                                                                              |
| ------------------- | -------------------------------------------------------------------------------------------------------- |
| **Thickness**       | Line thickness — Thin (1px), Medium (2px), or Thick (4px). Default: Thin.                                |
| **Color**           | Any CSS color — hex (`#ccc`), name (`gray`), or theme variable (`var(--border)`). Default: theme border. |
| **Width**           | How wide the line stretches across its container — `100%`, `50%`, `200px`, etc. Default: 100%.           |
| **Vertical Margin** | Empty space above and below the line. Default: 16px.                                                     |

## Examples

**Section break.** Drop a Divider between two top-level sections — Default settings work for most pages.

**Half-width centered rule.** Set Width to `50%`. The Divider centers automatically and creates a softer break than a full-width line.

**Heavy emphasis.** Set Thickness to `Thick (4px)` and Color to your brand accent colour for a deliberate, attention-grabbing separator.

## Related

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Space</strong></td><td>Add empty space without a visible line.</td><td><a href="/pages/RNFtvknsImsww5513GTb">/pages/RNFtvknsImsww5513GTb</a></td></tr><tr><td><strong>Row</strong></td><td>Group content side-by-side with structural separation.</td><td><a href="/pages/X8iFEn2kZKLwzxA43m0n">/pages/X8iFEn2kZKLwzxA43m0n</a></td></tr></tbody></table>


---

# Agent Instructions: 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.in8sync.com/client-admin-guide/active-workflows/getting-started/layout-components/divider.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.