Content card
Title, one supporting line, one action.
ActionComponents laboratory
The design system, running live
These aren't screenshots — every station below is the real component, interactive and keyboard accessible. This is the level of interface detail SWRV projects ship with.
Buttons
Variants, sizes, and press feedback — try tabbing through them.
Form with live validation
Labeled fields, described errors, keyboard-first.
Navigation & mobile nav
Desktop nav pattern plus the sheet-based mobile menu.
The real site header uses this exact pattern — dropdown groups on desktop, an accordion sheet on mobile.
Cards
The house card: hairline border, quiet hover lift, one clear action.
Data card
Live$4,820
Demo metric · this week
POSStripe
Tabs & accordion
Arrow-key navigable tabs; accessible accordion animation.
Tab panels keep focus order intact and respect reduced motion.
Dialog & sheet
Focus is trapped, Escape closes, focus returns to the trigger.
Data table with search & filters
The pattern behind every SWRV dashboard — including its empty state.
| Customer | Engagement | Status | Value |
|---|---|---|---|
| Harbor Cafe | Website + ordering | Active | $1,240/mo |
| Verdant Spa | Booking system | Active | $860/mo |
| Coastal Charters | Custom software | Pending | $2,100/mo |
| Summit Outfitters | Ecommerce + POS | Active | $3,420/mo |
| Plaza Dental | Local growth | Paused | $390/mo |
Demo data — fictional businesses.
Chart module
Lightweight SVG chart — no chart library, no bundle cost.
Monthly revenue (demo data)
+18%
Demo growth metric
Illustrative data
$84k
Demo revenue metric
Illustrative data
Service selector
A radio-group selector — keyboard navigable with arrow keys.
Selected: Website + commerce — demo pricing, not a quote.
Product display
Variant selection updates the artwork and the state readout.
Field Bottle · 32 oz
$28 · demo product
Dashboard module
A KPI block with activity feed — the ops-dashboard building block.
Today
23
Bookings
Demo data
$3.1k
Collected
Demo data
- 10:24 — Booking #218 confirmed and invoiced
- 09:51— Reminder sent for tomorrow's 8:00 slot
Interactive system diagram
The homepage System Map pattern, miniaturized.
Takes the order and hands it to the register — no re-typing.
Loading, empty & error states
Every data view ships with all four states — preview each.
Loading…
Switches, badges & progress
Small controls that carry state honestly.
DefaultOutlinesystem-label
Project completion60%
Alerts
Informational and destructive notices with proper roles.
Heads up
Your domain renews in 14 days — nothing to do, autorenew is on.
Sync failed
The POS export at 6:00 didn't complete. Alerts pair the problem with the next action — here, a retry.
Conversion section
The pattern that ends every SWRV page — one primary path.
One clear ask, one loud button
Conversion sections earn attention with contrast and restraint — not animation volume.
Start a project