FireBNB Design System

60-30-10 Color System & Design Tokens Gallery

FbButton

Primary Action (Cyber Lime Pill)
Secondary Action (Outline/Border)
Destructive Action
Text Action
Elevated Bezel & Trailing Icon (Apple/Linear-tier)
States Matrix

FbCard & FbTextField

FbCard (Interactive Custom Radius & Depress)
FbCard with Double Bezel (Nested Outer Shell)

Concentric Double Bezel Card

Combines a subtle outer border enclosure with an inner glass pane using concentric radii curves. Beautiful for hero components.

FbTextField (Glass Pill Inputs)
Phone Number
OTP Verification Code
The OTP code is invalid or has expired.

FbChip & FbStatusPill

FbChip (Unselected Border / Accent Active Capsule)
FbStatusPill (Semantic Status Badges)
CONFIRMEDConfirmed
PENDINGPending
EXPIREDExpired
CANCELLEDCancelled

FbOtpBoxes (Interactive OTP Verification)

Autofocused slots. Sunken by default. Typing highlights the active slot. Incorrect entries shake and light up red.

FbSkeleton

Pulse Loading Slots

FbCountdownRing (Chronometer Watch Dial)

Inset Groove Sweeps
REMAINING10:45
>5 min (Primary Lime)
REMAINING03:12
1–5 min (Warning Orange)
REMAINING00:45
<1 min (Danger Red + Pulse)

FbStatusTimeline

Lanes + Active Nodes

Search initiated

Searching across 12 vendors

Outreach in progress

Connecting with operators in real-time

Best rate matched

Finalizing negotiation sheet details

Booking confirmation

Review and accept negotiated rates

FbEmptyState

You are offline

Please check your internet connection and try again to sync countdown status.

FbAsciiDots (Interactive Braille Wave Background)

Interactive Controls
Draw Click Ripple Circles
Live Component Frame (Hover/Click to Ripple)

Interactive Grid Canvas

Hover over or click inside this frame to generate waves

FbOfferCard (The Signature Negotiation Screen Component)

NEGOTIATED OFFERED RATE
INR5,400
INR 8,200Market average rate
You save INR 2,800 (34% off)
Room TypeDeluxe King Room with Pool View
CancellationFree cancellation until 24 hours before check-in
Inclusions
Buffet BreakfastAirport ShuttleHigh-speed Wi-Fi