Marker

A marker for labeling sections with optional icons, borders, and separators.

Optional section label

Installation

npx shadcn@latest add https://reactdocs.canceydejean.dev/r/marker.json

Usage

Use markers as section captions, inline notes, or divider labels in lists and forms.

import { Marker, MarkerContent, MarkerIcon } from "@/components/marker/marker";

export function Example() {
  return (
    <Marker>
      <MarkerIcon>{/* icon */}</MarkerIcon>
      <MarkerContent>Optional section label</MarkerContent>
    </Marker>
  );
}

Variants: default, separator (horizontal rules around the label), and border (bottom border). Render as another element with render.