Section Header

The lighter in-page header — it sits above a table, a card body or a settings group. A title with an optional badge, a description, actions on the right and a tabs row underneath.

tsx

1import { SectionHeader } from "@pestoui/core"

Badge, actions and tabs

The tabs slot scrolls sideways on a narrow screen instead of wrapping. Page Header is the larger, page-level counterpart.

Runs

128

Every execution from the last 30 days.

Title only, with a rule

border draws a hairline under the block.

Notifications

Choose what the workspace emails you about.

Props

Prop	Type	Default	Description
title	ReactNode	—	Required. Rendered as an h2.
description	ReactNode	—	Muted line under the title.
badge	ReactNode	—	Sits inline after the title — a count, a status.
actions	ReactNode	—	Right-aligned from sm up; drops under the text on a phone.
tabs	ReactNode	—	A Tabs / TabsList row rendered under the header, in a sideways scroller.
border	boolean	false	Hairline rule below the block.

PreviousSection Footer Next Segmented Bar

Pesto UI · 117 documented components