Item

A polymorphic layout system for metadata rows, panels, files listing card, and stack entries.

Item

A polymorphic layout system for metadata rows, panels, files listing card, and stack entries.

Preview

System Update

Configuration file resolved successfully.

Installation

pnpm dlx vibe-ui-kit@latest add item button

💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: button

Examples

Explore modular layout compositions including preview images, status indicators, actions, headers/footers, and stacks.

Widescreen Graphic

IMG

Widescreen graphic

Attached banner catalog file.

Avatar / Icon Media

Security Guard

Verification completed.

Actions List Row

Document.txt

Edited 2 hours ago.

Header & Footer Segments

Workspace statusID: #092

Production Cluster

Scaling nodes automatically.

Last sync: 1m agoOnline

Hoverable Card

Explore Components

Read our 38+ production-ready component sheets.

Grouped Stack List

Item A

First items task.

Item B

Second items task.

Themes

Explore design aesthetics side-by-side.

Default

Notification Hub

Receive workspace events instantly.

Glassmorphic

Frosted Dashboard

Blur radius configured around backdrop opacity.

Retro Brutalist

Neo brutalist element

SHADOW_OFFSET: [2px]

Neon Glow

Purple Aura panel

Glow shadows enabled on hover.

Cyberpunk

SYS_STATUS: RESOLVED

Port 3000 listening...

Props

Prop	Type	Default	Description
variant	'default' \| 'outline' \| 'muted' \| 'glass' \| 'retro' \| 'glow' \| 'cyberpunk'	'default'	The visual aesthetic theme to apply to the item container.
size	'default' \| 'sm' \| 'lg'	'default'	Padding and gap density size variant.
asChild	boolean	false	Change the underlying rendered element to a Slot component for polymorphism.

PreviousInput OTP

Next Kbd

Contributors

Jenish Sabhadiya

Item

Item

Preview

Installation

Examples

Themes

Props

Contributors

Theme Customizer