Wideset One-Page Showcase

Every component, every state, fully interactive. Themed for Taurus.

Colors · Brand

Taurus brand scale, derived from #d633e6.

brand-100
#fde4f9
brand-200
#f7b0eb
brand-300
#ef7ddc
brand-400
#e85ef0
brand-500
#d633e6
brand-600
#b01ec0
brand-700
#9418a3
brand-800
#7a1487

Typography

Type ramp using the DS font stack.

Display — The quick brown fox
Title — The quick brown fox
Subtitle — The quick brown fox
Body large — The quick brown fox jumps over the lazy dog
Body — The quick brown fox jumps over the lazy dog
Caption — secondary metadata
Mono — 0xf5...4335a · 28.04.2026

Button

Variant × preset × size with full hover / active / disabled states.

Primary · filled
Primary · border / ghost
Secondary
Semantic

Icon button

Ghost / border / filled variants in three sizes.

Filter button

Click to open a multi-select popover.

Text input

Default · focused · danger · disabled.

Select

Single-pick dropdown.

Multi select

Multi-pick with checkable items, persistent open.

Checkbox

Unchecked · checked · indeterminate · danger · disabled.

Radio

Mutual exclusion, ArrowUp/Down keyboard nav.

Switch

Slider

Drag the thumb to adjust.

Value: 40

Badge

Neutral Info Live Pending Failed 7 42

Chip

Click to toggle selected state.

All Active Archived Failed

Tag

Click × to remove.

trade-credit net-30 high-priority audited

Avatar

KB
KB
KB
TS
VT
A
B
C
+5

Tabs

Overview panel — high-level summary lives here.

Segmented control

Pagination

Inline alert

ℹ
Heads up. Network maintenance starts at 03:00 UTC.
✓
Approved. Transaction 664233 queued for broadcast.
!
Review needed. 7 transactions require manual approval.
✕
Rejected. HSM signature failed — retry.

Progress bar

Determinate values and indeterminate sweep.

Signing — 2 of 3 approvals
Trust score
Indeterminate

Progress stepper

✓Created
✓Approvers
3HSM Signature
4Broadcast
5Confirmed

Tooltip

Hover or focus an element with data-tooltip.

Accordion

Click any header to expand/collapse.

Max fees, fee paid by receiver, external reference, reconciliation note.

List item

KB
Kinga Barnas
kinga@taurus.io
Owner
TS
Tom Saunders
tom@taurus.io
Approver
VT
Validator
validator-core@taurusgroup.ch
Viewer