Sections

Basic application sections for organizing content and functionality - built with shadcn/ui.

Section with placeholder content in header, body and footer

This Shadcn section block provides a flexible container with a header, content area, and footer actions for common layouts. A card-style layout divided into a header (title area), body (lorem ipsum or content block) and footer (action buttons) so you can slot in your own text.

Section with title badge, search, actions and placeholder content

This Shadcn section block shows an alternate structure for the same core pattern so you can pick what fits your layout. A third example (section-3) likely rearranges header, body and actions, for instance aligning content to one side or including icons; its purpose is to showcase another common section structure.

Section with title badge, empty state message and call-to-action

This Shadcn section block is designed for empty states, combining status context with a clear next step. Includes a small badge for status, a short text explaining that no items are present, and a prominent button encouraging the user to take action.

Section with title, search, filters and data table

This Shadcn section block showcases a full table workflow inside a single card-style region. The header combines a title, description, search field and filter/new buttons; the body renders a data table of invoices; and the footer adds a pagination-style control with previous/next buttons and a "1–7 of 120" summary.

Get access to all Pro Blocks in our Premium Package

Buy now

Sections

Sections are the main building blocks of your pages. Each section is a reusable component, built with shadcn/ui, so you can drop it wherever you need it.

FAQs

Each section is its own component that you can reuse across different pages for consistency.