You’re exploring the full DataBridge platform free, with synthetic Future Horizons University data. Everything is unlocked; actions run in your demo session (in-session only, not saved to a real backend).

FHU Databridge
Enterprise
Pricing
Dev · Gallery

Component gallery

The in-app component gallery — a lightweight Storybook alternative that lives at /dev/components. Every shadcn/ui primitive and brand component is rendered below in its meaningful variants, sizes and states so designers and developers can eyeball the FHU Databridge design system in one place.

Button

class-variance-authority variants × sizes, plus disabled and icon+text states.

variant
size
state · disabled
composition · icon + text
As a link (asChild)

Badge

Every badge variant.

variant
default
secondary
destructive
outline
accent
muted

TierBadge

Subscription-tier badge for each of the three tiers.

tier
Free
Pro
Enterprise

Brand

The FHU Databridge mark + wordmark across sizes, and the standalone glyph.

size · wordmark
FHU DatabridgeFHU DatabridgeFHU Databridge
showWordmark={false} · glyph only

Card

Header / title / description / content / footer compositions.

Card with footer
Header, title, description, content and a footer action row.
Body content sits inside CardContent. Use it for metrics, copy, lists or form fields.
Pro
Highlighted
Accent-bordered card
A composition variant using a tinted border and badges in the header.
Pair the card with brand tokens (border-primary/30) for emphasis without leaving the design system.

Tabs

Radix-backed tabs with a list of triggers and per-tab content.

Overview panel — the default active tab.

Accordion

Single, collapsible accordion — the pattern used on the FAQ page.

Input

The native search input pattern used across the app (no shadcn Input primitive exists).

text
search · with leading icon
state · disabled

Sheet (dialog)

Radix-dialog-backed slide-over. Trigger buttons open it from each side.

side