Bento & Layout
Section Header
Eyebrow, title, subtitle, and optional trailing action block with a required explicit heading level prop.
$ velocityx add section-headerBuilt for astro.
Full docs for Section Header →
Pricing
Plans that scale with your team
Start free, upgrade when you add your fifth seat.
Integrations
Works with what you already run
Centred variant
For CTA bands and short intros.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| eyebrow | string | No | ||
| title | string | Yes | ||
| sub | string | No | ||
| headingLevel | 1 | 2 | 3 | 4 | 5 | 6 | Yes | ||
| align | 'left' | 'center' | No | 'left' | |
| className | string | No | '' |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/section-header/SectionHeader.astroUsing the Section Header component
Install it with velocityx add section-header.
The CLI writes the source straight into your project — no runtime dependency, no registry
lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.
Related components
More from Bento & Layout.
Reserves a stable aspect ratio for media to prevent layout shift, using the native CSS aspect-ratio property.
astroBreakpoint-free responsive card grid using CSS grid auto-fit/minmax, column count is purely a function of container width.
astroSingle card shell component with five variants (icon, stat, image, chart-slot, quote) sharing one accessible article shell.
astroResponsive 4-cell bento grid, 1 column on phone and 2x2 on tablet/desktop, with four named slots.
astro