Complete pages to inspect

Examples are meant to be opened and dissected.

Open these pages, inspect the markup, and lift patterns from working interfaces instead of isolated snippets.

Application pages

Inspect dashboard, settings, and auth flows.

Use these when you need a working shell, not a component catalog.

Admin dashboard Sidebar, topbar, stats, tables, actions

Inspect sidebar, topbar, stats, tables, filters, and actions in one page.

Admin settings Settings shell, forms, danger zones

Inspect local navigation, stacked settings sections, and longer-form preference layouts.

Login Centered auth shell

Inspect the narrow auth shell and a short single-task form.

Register Auth shell with longer form

Inspect how the same auth shell handles a longer form.

Reference pages

Inspect breadth quickly.

Use these when you need a wide scan of available patterns.

Core reference Wide component coverage

Inspect a broad set of primitives and interaction patterns in one page.

Icons reference Sprite and class-based icon use

Inspect icon names and copy either SVG use syntax or <i> tag syntax.

Public pages

Inspect homepage, pricing, FAQ, and contact patterns.

Use these when you need public-facing page structure rather than app shells.

Home Public entry page

Inspect a public homepage built from the same primitives.

Pricing Tier comparison

Inspect repeated plan blocks and comparison rhythm.

FAQ Disclosure-heavy information

Inspect a long informational page with repeated disclosure patterns.

Contact Simple form and content pairing

Inspect a simple support/contact layout with a small form.

Working habit

Inspect the page, then strip it down.

Start from the real page, keep the structure you need, and delete the rest. These examples are here to be opened and taken apart.

Open example
Inspect structure
Copy shell
Replace content
Delete unused classes