UIPackage
Menu

Framework

Vue React
GitHub

Components

118 components · 9 categories · Vue (Nuxt 4)

▎ Actions — 5 components

ButtonGhost
button
clipboard
clipboard
theme-switch
BIU
toggle
BIU
toggle-group

▎ Forms & Inputs — 20 components

Vue×Tailwind×▾
advance-select
cascade-select
cascade-select
Yes
No
Maybe
checkbox
#FFC857
color-picker
Drop files
file-upload
Email
form
Emailanna@example.com
Password••••••••
URLhttps://…
input
Username
label
(415) 555-____
masked-input
−42+
number-field
42
pin-input
Free
Pro
Team
radio-group
range-slider
★★★★★
rating
BIU
rich-text-editor
Choose…▾
select
slider
switch
vueui+ tag…
tags-input
The quick brown fox…
textarea

▎ Data Display — 49 components

Installation
Examples
Files
anchor
JD
RK
MS
+5
avatar
defaultsuccesswarningdangerinfo
badge
board
carousel
Vue×Tailwind× + Add
chip
$ npm install
code-block
countdown
countdown
StatusActive
PlanPro
Seats12
data-list
Filter…1–3 / 24
Name ▾StatusDate
AnnaActive05/12
RaviPending05/14
MiraActive05/16
data-table
dock
dock
fab
fab
float-label
float-label
gradient-text
gradient-text
highlight
highlight
icon-box
icons
image-compare
image-compare
infinite-scroll
infinite-scroll
json-tree-view
json-tree-view
⌘+K
kbd
65
knob
Revenue
$48k
Users
1.2k
MRR
$12k
Churn
2.4%
kpi-grid
StatusActive
OwnerAnna L
ID#3214
labeled-value
lazy-image
link
link
First
Second
Third
list
loading-bar
loading-bar
map
marquee
marquee
Hi @alice — ship it?
mentions
organization-chart
organization-chart
overlay-scroll
password-input
password-input
payment-card
qr-code
signature-pad
signature-pad
speed-dial
speed-dial
Name Status Owner
AtlasActiveAnna
BeaconIdleRavi
CinderActiveMira
table
terminal
terminal
Created
Updated
Shipped
timeline
Step 1 of 4
Click to start
tour
Available
→←
Selected
transfer
tree-select
tree-select
tree-table
tree-table
▾ src
▸ components
▾ pages
index.vue
tree-view
video
video
Row 412
Row 413
Row 414
Row 415
virtual-list
watermark
watermark

▎ Feedback — 11 components

Heads up
Inline message.
alert
block-ui
block-ui
circular-progress
circular-progress
empty-state
icon-transition
65%
progress
Build100%
Test65%
Deploy20%
progress-item
Uploading…65%
progress-linear
skeleton
Updating profile…
Saved successfully
sonner
spinner

▎ Overlays — 9 components

!Delete item?
This can't be undone.
CancelDelete
alert-modal
Search…⌘K
→ Settings
command
Cut
Copy
Paste ›
context-menu
Edit profile
Update name & bio.
CancelSave
dialog
Options ▾
dropdown-menu
Mentioned by Anna earlier today.
AL
hover-card
Click me
popover
CancelSave
sheet
Open settings Hover me
tooltip

▎ Navigation — 10 components

back-top
back-top
bottom-navigation
bottom-navigation
Home/Settings/Account
breadcrumb
FileEditView
New… ⌘N
Open… ⌘O
menubar
Products ▾SolutionsDocs
→ Vue Kit
→ React Kit
navigation-menu
123…12
pagination
Nav
Content
sidebar
1
2
3
4
stepper
AllActiveDone
tabs
General
Account
Billing
Settings…
vertical-tabs

▎ Disclosure — 2 components

Section 1+
Section 2+
accordion
Section 1+
Section 2+
collapsible

▎ Layout — 8 components

16:9
aspect-ratio
card
grid
page
resizable
line 1
line 2
line 3
line 4
scroll-area
Auto▾
section-card
separator

▎ Date & Time — 4 components

‹May 2026›
SMTWTFS
123456789101112131415161718192021
calendar
2026-05-16▾
date-picker
‹May 2026›
SMTWTFS
123456789101112131415161718192021
range-calendar
14:32
time-picker