Section Header

Eyebrow badge, headline, and description to anchor content sections.

Preview

Content

Make each section feel intentional.

Use this header to anchor content blocks with bold hierarchy.

Installation

terminal
$
Other package managers 
bunx --bun shadcn@latest add https://trents.tech/r/section-header.json

Usage

section-header-demo.tsx
import SectionHeader from "@/components/blocks/section-header"

export default function SectionHeaderDemo() {
  return (
    <SectionHeader
      // Swap headline copy and alignment as needed.
      eyebrow="Content"
      title="Make each section feel intentional."
      description="Use this header to anchor content blocks with bold hierarchy."
      align="left"
    />
  )
}
0