Dividers are a horizontal line that separates content within a list or section.


Core Component & Variants

Untitled

Core Components
Property Name Property Type Property Value
Variant Variant Full Width Thin
Full Width Thick
Padded Thin
Use Label

Examples

Untitled


Best Practices

  1. Use dividers to visually separate content and provide clear distinctions between sections or elements within a screen.
  2. Align dividers with the overall visual hierarchy of the app. They should follow the design principles and guidelines of either iOS or Material Design, depending on the platform you are designing for.
  3. Keep dividers simple and subtle. They should enhance the user interface without overpowering or distracting from the main content.
  4. Use dividers wisely and avoid using too many of them, as it can make the screen feel crowded and overwhelming.
  5. Consider the context and purpose of dividers. Use thicker dividers to indicate stronger visual separation, such as between major sections or groups of content. Thinner dividers can be used for subtle distinctions within a section or to separate smaller elements.