Theme Studio
Visual design token editor

Button

Variants

NormalDisabledLoading
default
secondary
outline
ghost
destructive

Sizes

Small
Medium
Large

Checkbox

Input

As it appears on your passport
Enter a valid email address

Select

Basic (md)

With label + helper (SelectField)

We'll ship to this address.

Error state

Please select a plan.

Switch

Radio

Default (md)

Choose a plan

Small

Billing cycle

Disabled group

Disabled group

Slider

Default (md)

With value + format

$100

Small

Combobox

Basic (no label)

With label

Select the country where you are located.

Disabled

Badge

Branddefault
Graysecondary
Outlineoutline
Errordestructive
Successsuccess
Warningwarning
Infoinfo
OnlineOfflineAway
smmd
VerifiedCriticalNew

Separator

Horizontal

Vertical

Item A
Item B
Item C

With label

OR

Tabs

Default — pill

Account content

Underline

Overview content

With count badge

Inbox — 12 unread

With disabled tabs

General settings

Want the full component library?
Leave your email — we'll notify you when it's ready.
built by
Alexander
↗