QuackElements
Browse components+
Components/Separator

Separator

A visual divider that organizes related groups of content.

Interactive example

QuackElements

Source-first components for product teams.

Built in the open by QuackBytes.

Installation

Run the CLI from your project root. Dependencies and component source are added automatically.

$npx quackelements add separator

Usage

The generated file lives in your repository, so the component API and styles remain fully editable.

example.tsx
import { Separator } from "@/components/quack/separator"

export function SeparatorDemo() {
  return (
    <div>
      <p className="font-medium">QuackElements</p>
      <p className="text-sm text-muted-foreground">Source-first components.</p>
      <Separator className="my-4" />
      <p className="text-sm">Built by QuackBytes.</p>
    </div>
  )
}