Back to Appsmith

Divider

app/client/packages/design-system/ads/src/Divider/Divider.mdx

1.99822 B
Original Source

import { Canvas, Meta } from "@storybook/blocks";

import * as DividerStories from "./Divider.stories";

<Meta of={DividerStories} />

Divider

A divider is a thin line that groups content in lists and layouts.

<Canvas of={DividerStories.DividerStory} />

Kind

Horizontal

<Canvas of={DividerStories.DividerStory} />

Vertical

<Canvas of={DividerStories.DividerVerticalStory} />

Usage

  • Dividers are a useful tool for organizing content into distinct groups. They can differentiate between types of information or create visual hierarchy.
  • Supports horizontal and vertical scrolling, and grows to the length of the parent.
  • Use dividers sparingly and consider other design elements, such as space, to achieve balance in your design.

TODO: When should we use dividers and when should we use space?