Item

Item with Crafter styling. Explore the live example and use the source in your project.

shadcn / Base UI

Default

Title Only

Title + Button

Title + Description

This is a description that provides additional context.

Title + Description + Button

This item includes a title, description, and action button.

Media + Title

Media + Title + Button

Media + Title + Description

This item includes media, title, and description.

Media + Title + Description + Button

Complete item with all components: media, title, description, and button.

Multiple Actions

Item with multiple action buttons in the actions area.

Installation

Add the shadcn primitive and the shared Crafter theme to a Base UI project. The theme updates your project-wide tokens.

Terminal

bunx --bun shadcn@4.21.0 add http://localhost:4324/r/item.json

First time here? Read the setup guide ↗

Composition

A foundation for your own components. The source stays close to the upstream API.

Item

From the foundation

These primitives use shadcn Base UI with the same Crafter colors, typography and corners as this entire site. Customize that shared identity in the style generator.

Upstream documentation ↗