Components

Item

A row that pairs media, text and actions.

@blank/ui
57 components, no runtime package.

Installation

npx shadcn@latest add @blank/item

Usage

import {
  Item,
  ItemActions,
  ItemContent,
  ItemDescription,
  ItemMedia,
  ItemTitle,
} from "@/components/ui/item"
<Item>
  <ItemMedia variant="icon">
    <PackageIcon />
  </ItemMedia>
  <ItemContent>
    <ItemTitle>Title</ItemTitle>
    <ItemDescription>Description</ItemDescription>
  </ItemContent>
  <ItemActions>
    <Button size="sm" variant="outline">
      Action
    </Button>
  </ItemActions>
</Item>

Examples

Variants

default
Domain verified two days ago.
outline
Domain verified two days ago.
muted
Domain verified two days ago.

asChild renders the item as your link, and links get a hover surface on their own.

Image and group

shadcn
@shadcn
Vercel
@vercel