Skip to content
flood.md
v0.2.10

Divider

A semantic separator with a low-emphasis visual line.

Preview

Workspace

Account

Use Divider

Divider is a named export of @flood-md/react. Connect the package once, then import what you use.

First time here? Connect Flood
Example import style
divider.tsxTSX
"use client";

import { FloodRoot, Stack, Text, Divider } from "@flood-md/react";
import "@flood-md/react/styles.css";

export function Example() {
  return (
    <FloodRoot>
      <Stack gap="4">
        <Text>Workspace</Text>
        <Divider />
        <Text>Account</Text>
      </Stack>
    </FloodRoot>
  );
}

Design notes

  • The line is decorative in contrast terms: content grouping must remain understandable without seeing it.
  • Divider renders a native hr; it has no orientation prop.

API reference

PropValuesDefault
Native HTML propsHTMLAttributes<HTMLHRElement>Forwarded
View TypeScript source
Page MarkdownAgent skill