ComponentServer-safe

Item

A flexible content row for settings, resources and action lists.

Installation

Preview

Component registry

Publish editable primitives to every project.

Theme settings

Adjust color, radius and typography tokens.

Ready

Usage

tsx

import { Item, ItemActions, ItemContent, ItemDescription, ItemMedia, ItemTitle } from "@/components/ui/item"

<Item variant="outline">
  <ItemMedia variant="icon">...</ItemMedia>
  <ItemContent>
    <ItemTitle>Design system</ItemTitle>
    <ItemDescription>Shared tokens and components.</ItemDescription>
  </ItemContent>
  <ItemActions>...</ItemActions>
</Item>

API reference

Prop	Type	Default	Description
`variant`	`"default" \| "outline" \| "muted"`	`"default"`	Visual surface treatment.
`size`	`"default" \| "sm"`	`"default"`	Controls spacing and geometry.
`asChild`	`boolean`	`false`	Merges Item behavior onto its child.
`className`	`string`	`—`	Overrides or extends the generated Tailwind classes.
`disabled`	`boolean`	`false`	Prevents user interaction when supported.