---
id: divider
title: Divider
---

import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
import {} from "react-native-elements";
import Usage from "../component_usage/Divider.mdx";

Dividers are visual separators of content.
Use Divider when you want to make a distinction between sections of content.
Our divider offers adding inset, color, orientation and subHeader to the component using props.
Also receives all [View](https://reactnative.dev/docs/view#props) props.

## Usage

<Usage />

## Props

:::note
Includes all [View](https://reactnative.dev/docs/view#props) props.
:::

<div class='table-responsive'>

| Name             | Type                          | Default      | Description                                           |
| ---------------- | ----------------------------- | ------------ | ----------------------------------------------------- |
| `color`          | string                        |              | The color of the component.                           |
| `inset`          | boolean                       | `false`      | Applies inset to the divider.                         |
| `insetType`      | `middle` or `left` or `right` | `left`       | Applies inset to a specific direction to the divider. |
| `orientation`    | `vertical` or `horizontal`    | `horizontal` | Apply orientation to the divider.                     |
| `style`          | View Style                    |              | Applies style to the divider.                         |
| `subHeader`      | string                        |              | Adds subHeader text to the divider.                   |
| `subHeaderStyle` | Text Style                    |              | Adds style to the subHeader text of the divider       |
| `width`          | number                        |              | Apply width to the divider.                           |

</div>
