Patterns

Patterns are complete application compositions, such as a modal, a notification or a page header. They are part of Siteplane UI Pro, which includes patterns, sections and templates, all built from the free Siteplane UI components.

The previews on every Pattern page are free to view and try. The source of a Pattern and of each of its examples is included with a Siteplane UI Pro license and installs through the shadcn CLI with your license key. A Pattern installs under the name in its page address, such as @siteplane-pro/modal-block. Each of its examples installs as its own item, such as @siteplane-pro/modal-block-payment-example, and every Pattern page shows these commands. Get a license on the Pro page.

Application

• Activity Feed: Show recent events by people with avatars, times and attachments.
• File Upload: Drop or browse files and follow each upload’s progress.
• Header Navigation: Lay out a site header with logo, menus, search and account.
• Inline CTA: Invite an action inside a page, such as subscribing or upgrading.
• Metric Card: Show a key figure with its change and context.
• Modal: Ready-made modals for confirmations, forms, sharing, payments and more.
• Notification: Tell people about an update with an icon, text and actions.
• Page Header: Introduce a page with its title, breadcrumb, actions and search.
• Password Strength: Show how strong a new password is while the user types, with the requirements it still misses.

Backgrounds

• Background Pattern: Put a decorative grid, dot or line pattern behind a section or card.