Page Header
A page header block with title, description, actions, and breadcrumbs.
Saved preference for
elorm init --ui-library base-uiProjects
Manage your teams, members, and active deployments.
PreviewCode
import { Button } from "@/components/ui/button"
import { PageHeader } from "@/components/blocks/page-header"
export function PageHeaderDemo() {
return (
<div className="w-full max-w-2xl rounded-lg border border-border p-4">
<PageHeader
title="Projects"
description="Manage your teams, members, and active deployments."
actions={<Button size="sm">Create project</Button>}
/>
</div>
)
}
Installation#
Usage#
import { PageHeader } from "@/components/blocks/page-header"A page header block with title, description, actions, and breadcrumbs.