Section

Vertical rhythm band page section container enforcing consistent vertical padding scales across viewports.

// Plain markup
import { Section } from "@shavin/ui";

Padded Page Section

Section Block Header

Structured page section content.

<Section size="2" className="border border-hairline rounded-[var(--radius-panel)] bg-surface p-6">
  <h3 className="text-lg font-semibold text-fg">Section Block Header</h3>
  <p className="text-sm text-fg-muted mt-1">Structured page section content.</p>
</Section>

Props

Prop	Type	Default
as	ElementType	—
translucent	boolean	—
size	"1" \| "2" \| "3" \| "4"	"2"