shadcn/studio

Command Palette

Search for a command to run...

GithubXDiscord
Sign inSign inGet all accessGet all access

shadcn/studio Components Documentation

Everything you need to know about shadcn/studio components and how to use it.

What we provide?

We provide a rich catalog of production-ready component variants that you can use directly in any shadcn/ui project via a simple CLI command. Each variant is accessible, theme-aware, and fully typed, with sensible defaults.

How to effectively use the shadcn/studio variants?

Before using the shadcn/studio variants, make sure that you've installed shadcn in your project by following the official installation guide.

Visit the Components page to explore components variants.

components light

Copy the Code

  • Choose your desired component (e.g., Accordion).
  • Click the Code button to view different files containing respective code.
    • get code image
  • Copy the code and paste it into your project where needed.
    • copy component

Using CLI

shadcn/studio enhances the original shadcn/ui CLI, offering an easy way to install our components.

  • Select the desired CLI version
    • copy prompt
  • Copy the CLI command by clicking the copy icon.
    • get code image
  • Run the copied command in your project terminal.

Using Copy Prompt Functionality

The Copy Prompt feature in shadcn/studio allows you to quickly generate AI-optimized prompts for effortless integration of components into your project. Click the Copy Prompt button on any component section. Paste the copied prompt into your preferred IDE like VS Code, Cursor, or Windsurf and append custom instructions such as desired layout, placement context, or target framework conversions. Let the AI editor do the rest.

copy prompt

Use v0

v0 integration allows you to seamlessly import shadcn/studio components directly into Vercel's v0 platform for rapid prototyping and development. Simply click the "v0" button on any component, and it will automatically open in v0 with all the necessary code, components, and styling pre-configured. This feature enables you to quickly iterate, customize, and deploy your components within v0's AI-powered development environment.

copy prompt