shadcn.io

https://www.shadcn.io
Admin
shadcn.io is a community-driven component library providing thousands of production-ready UI blocks...
Tokens:12,094,408
Snippets:95,236
Trust Score:6.9
Update:5 months ago
Show doc for...
Tokens:
Raw
### Install Onboarding CI/CD Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-ci-cd-setup

Use this command to install the CI/CD setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-ci-cd-setup.json
```

--------------------------------

### Install Onboarding Guided Walkthrough with bun

Source: https://www.shadcn.io/blocks/onboarding-guided-walkthrough

Use this command to install the guided walkthrough block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-guided-walkthrough.json
```

--------------------------------

### Install Storefront Size Guide with bun

Source: https://www.shadcn.io/blocks/storefront-size-guide

Use this command to install the storefront size guide component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/storefront-size-guide.json
```

--------------------------------

### Install Onboarding Guided Walkthrough with npm

Source: https://www.shadcn.io/blocks/onboarding-guided-walkthrough

Use this command to install the guided walkthrough block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-guided-walkthrough.json
```

--------------------------------

### Install Onboarding CI/CD Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-ci-cd-setup

Use this command to install the CI/CD setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-ci-cd-setup.json
```

--------------------------------

### Install Onboarding Domain Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-domain-setup

Use this command to install the Onboarding Domain Setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-domain-setup.json
```

--------------------------------

### Install Onboarding Domain Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-domain-setup

Use this command to install the Onboarding Domain Setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-domain-setup.json
```

--------------------------------

### Install Stepper Onboarding Guide with bun

Source: https://www.shadcn.io/blocks/stepper-onboarding-guide

Use this command to install the stepper onboarding guide component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/stepper-onboarding-guide.json
```

--------------------------------

### Install Onboarding Environment Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-environment-setup

Use this command to install the onboarding environment setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-environment-setup.json
```

--------------------------------

### Install Storefront Size Guide with npm

Source: https://www.shadcn.io/blocks/storefront-size-guide

Use this command to install the storefront size guide component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/storefront-size-guide.json
```

--------------------------------

### Install Onboarding Billing Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-billing-setup

Install the onboarding billing setup component using the shadcn CLI with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-billing-setup.json
```

--------------------------------

### Install Onboarding CI/CD Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-ci-cd-setup

Use this command to install the CI/CD setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-ci-cd-setup.json
```

--------------------------------

### Install Onboarding Billing Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-billing-setup

Install the onboarding billing setup component using the shadcn CLI with npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-billing-setup.json
```

--------------------------------

### Install Onboarding CI/CD Setup with yarn

Source: https://www.shadcn.io/blocks/onboarding-ci-cd-setup

Use this command to install the CI/CD setup block using yarn.

```bash
yarn dlx shadcn@latest add https://www.shadcn.io/r/onboarding-ci-cd-setup.json
```

--------------------------------

### Install Onboarding API Key Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-api-key-setup

Use this command to install the Onboarding API Key Setup component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-api-key-setup.json
```

--------------------------------

### Install Onboarding Profile Setup Block with bun

Source: https://www.shadcn.io/blocks/onboarding-profile-setup

Use this command to install the onboarding profile setup block using bun. Ensure you have bun installed.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-profile-setup.json
```

--------------------------------

### Install Onboarding Environment Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-environment-setup

Use this command to install the onboarding environment setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-environment-setup.json
```

--------------------------------

### Install Stepper Onboarding Guide with npm

Source: https://www.shadcn.io/blocks/stepper-onboarding-guide

Use this command to install the stepper onboarding guide component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/stepper-onboarding-guide.json
```

--------------------------------

### Install Onboarding Profile Setup Block with npm

Source: https://www.shadcn.io/blocks/onboarding-profile-setup

Use this command to install the onboarding profile setup block using npm. Ensure you have Node.js and npm installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-profile-setup.json
```

--------------------------------

### Install Onboarding Guided Walkthrough with yarn

Source: https://www.shadcn.io/blocks/onboarding-guided-walkthrough

Use this command to install the guided walkthrough block using yarn.

```bash
yarn dlx shadcn@latest add https://www.shadcn.io/r/onboarding-guided-walkthrough.json
```

--------------------------------

### Install Storefront Size Guide with pnpm

Source: https://www.shadcn.io/blocks/storefront-size-guide

Use this command to install the storefront size guide component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/storefront-size-guide.json
```

--------------------------------

### Install Onboarding Guided Walkthrough with pnpm

Source: https://www.shadcn.io/blocks/onboarding-guided-walkthrough

Use this command to install the guided walkthrough block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-guided-walkthrough.json
```

--------------------------------

### Install Onboarding Channel Setup Block (bun)

Source: https://www.shadcn.io/blocks/onboarding-channel-setup

Use this command to install the onboarding channel setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-channel-setup.json
```

--------------------------------

### Install Onboarding Category Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-category-setup

Use this command to install the Onboarding Category Setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-category-setup.json
```

--------------------------------

### Install Onboarding Environment Setup with yarn

Source: https://www.shadcn.io/blocks/onboarding-environment-setup

Use this command to install the onboarding environment setup block using yarn.

```bash
yarn dlx shadcn@latest add https://www.shadcn.io/r/onboarding-environment-setup.json
```

--------------------------------

### Install Onboarding Pipeline Setup with bun

Source: https://www.shadcn.io/blocks/onboarding-pipeline-setup

Use this command to install the onboarding pipeline setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-pipeline-setup.json
```

--------------------------------

### Install Stepper Onboarding Guide with pnpm

Source: https://www.shadcn.io/blocks/stepper-onboarding-guide

Use this command to install the stepper onboarding guide component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/stepper-onboarding-guide.json
```

--------------------------------

### Block Installation Example

Source: https://www.shadcn.io/item-examples

Example command to install a shadcn/ui block, specifically 'hero-block/split', using an AI agent via MCP. Demonstrates the ease of installing pre-built sections.

```bash
▸add_item("hero-block/split")
```

--------------------------------

### Install Onboarding Domain Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-domain-setup

Use this command to install the Onboarding Domain Setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-domain-setup.json
```

--------------------------------

### Install Onboarding Channel Setup Block (npm)

Source: https://www.shadcn.io/blocks/onboarding-channel-setup

Use this command to install the onboarding channel setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-channel-setup.json
```

--------------------------------

### Install Onboarding API Key Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-api-key-setup

Use this command to install the Onboarding API Key Setup component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-api-key-setup.json
```

--------------------------------

### Install Onboarding Billing Setup with yarn

Source: https://www.shadcn.io/blocks/onboarding-billing-setup

Install the onboarding billing setup component using the shadcn CLI with yarn.

```bash
yarn dlx shadcn@latest add https://www.shadcn.io/r/onboarding-billing-setup.json
```

--------------------------------

### Install Onboarding Environment Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-environment-setup

Use this command to install the onboarding environment setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-environment-setup.json
```

--------------------------------

### Install Onboarding Category Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-category-setup

Use this command to install the Onboarding Category Setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-category-setup.json
```

--------------------------------

### Install Onboarding Pipeline Setup with npm

Source: https://www.shadcn.io/blocks/onboarding-pipeline-setup

Use this command to install the onboarding pipeline setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-pipeline-setup.json
```

--------------------------------

### Install Onboarding Profile Setup Block with pnpm

Source: https://www.shadcn.io/blocks/onboarding-profile-setup

Use this command to install the onboarding profile setup block using pnpm. Ensure you have pnpm installed.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-profile-setup.json
```

--------------------------------

### Install Onboarding Billing Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-billing-setup

Install the onboarding billing setup component using the shadcn CLI with pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-billing-setup.json
```

--------------------------------

### Install Onboarding API Key Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-api-key-setup

Use this command to install the Onboarding API Key Setup component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-api-key-setup.json
```

--------------------------------

### Install Field Input with Description Above

Source: https://www.shadcn.io/examples/field-input-with-description-above

Use this command to install the necessary components for the 'Input with Description Above' example. This command fetches the configuration from the provided URL.

```bash
npx shadcn@latest add https://www.shadcn.io/r/field-input-with-description-above.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/field-input-with-description-above.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/field-input-with-description-above.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/field-input-with-description-above.json
```

--------------------------------

### Install Onboarding Pipeline Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-pipeline-setup

Use this command to install the onboarding pipeline setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-pipeline-setup.json
```

--------------------------------

### Install Onboarding Category Setup with pnpm

Source: https://www.shadcn.io/blocks/onboarding-category-setup

Use this command to install the Onboarding Category Setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-category-setup.json
```

--------------------------------

### Install Empty State Component with bunx

Source: https://www.shadcn.io/blocks/empty-state-getting-started

Use this command to install the empty state getting started component using bunx.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/empty-state-getting-started.json
```

--------------------------------

### Install Onboarding Sample Data with bun

Source: https://www.shadcn.io/blocks/onboarding-sample-data

Use this command to install the onboarding sample data component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-sample-data.json
```

--------------------------------

### Install Stepper Account Setup with bun

Source: https://www.shadcn.io/blocks/stepper-account-setup

Use this command to install the Stepper Account Setup component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/stepper-account-setup.json
```

--------------------------------

### Install Empty State Component with pnpm

Source: https://www.shadcn.io/blocks/empty-state-getting-started

Use this command to install the empty state getting started component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/empty-state-getting-started.json
```

--------------------------------

### Install Onboarding Webhook Setup Block

Source: https://www.shadcn.io/blocks/onboarding-webhook-setup

Install the onboarding webhook setup block using the shadcn CLI. This command adds the component to your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-webhook-setup.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-webhook-setup.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-webhook-setup.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-webhook-setup.json
```

--------------------------------

### Install Google Cloud Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-google-cloud-setup

Use this command to install the Google Cloud integration setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-google-cloud-setup.json
```

--------------------------------

### Install Onboarding Channel Setup Block (pnpm)

Source: https://www.shadcn.io/blocks/onboarding-channel-setup

Use this command to install the onboarding channel setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-channel-setup.json
```

--------------------------------

### Install Empty State Component with npm

Source: https://www.shadcn.io/blocks/empty-state-getting-started

Use this command to install the empty state getting started component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/empty-state-getting-started.json
```

--------------------------------

### Toggle With Text Example

Source: https://www.shadcn.io/view/toggle/with-text

This is a basic example of a toggle component that includes text labels. Ensure you have the necessary dependencies and have followed the shadcn/ui setup guide.

```typescript
import {
  ToggleGroup,
  ToggleGroupItem,
} from "@/components/ui/toggle-group";

export function ToggleGroupDemo() {
  return (
    <ToggleGroup type="multiple" className="inline-flex">
      <ToggleGroupItem value="bold" aria-label="Toggle bold">
        Bold
      </ToggleGroupItem>
      <ToggleGroupItem value="italic" aria-label="Toggle italic">
        Italic
      </ToggleGroupItem>
      <ToggleGroupItem value="underline" aria-label="Toggle underline">
        Underline
      </ToggleGroupItem>
    </ToggleGroup>
  );
}
```

--------------------------------

### Install Notion Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-notion-setup

Use this command to install the Notion integration setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-notion-setup.json
```

--------------------------------

### Prompt AI Agent to Install Castle Icon

Source: https://www.shadcn.io/icon/fluent-emoji-high-contrast-castle

Example of prompting an AI agent like Claude Code to install the Castle icon. This showcases the integration with AI development tools for quick setup.

```bash
`$ claude mcp add shadcnio/fluent-emoji-high-contrast/castle`
```

--------------------------------

### Usage Example: Stackshare Icon in React/Next.js

Source: https://www.shadcn.io/icon/cib-stackshare

Import and use the Stackshare icon component within your React or Next.js application. No specific setup is required beyond installing the icon.

```jsx
import { Stackshare } from "icons/stackshare";

function MyComponent() {
  return <Stackshare />;
}
```

--------------------------------

### Install GitHub Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-github-setup

Use this command to install the GitHub integration setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-github-setup.json
```

--------------------------------

### Install Onboarding Department Setup with shadcn CLI (bun)

Source: https://www.shadcn.io/blocks/onboarding-department-setup

Install the Onboarding Department Setup block using the shadcn CLI with bun. This command fetches the component's JSON configuration and adds it to your project.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-department-setup.json
```

--------------------------------

### Quick Start cURL Example

Source: https://www.shadcn.io/blocks/account-developer

Use this cURL command to make a GET request to the users endpoint. Ensure you replace 'sk_live_...' with your actual API key and '2026-03-15' with the correct API version.

```bash
curl -X GET "https://api.acme.com/v2/users"   -H "Authorization: Bearer sk_live_..."   -H "Content-Type: application/json"   -H "X-Api-Version: 2026-03-15"
```

--------------------------------

### Fetch Icon and Install Command

Source: https://www.shadcn.io/mcp/tools/get-icon

This example shows how to use the get_icon tool to fetch a specific icon and then extract the install command from the response. It's useful for automating icon integration.

```bash
curl -s -X POST "https://www.shadcn.io/api/mcp?token=YOUR_TOKEN" \
-H "content-type: application/json" \
-d '{ 
  "jsonrpc": "2.0", 
  "id": 1, 
  "method": "tools/call", 
  "params": { 
    "name": "get_icon", 
    "arguments": { "library": "lucide", "name": "arrow-right" } 
  } 
}' | jq -r '.result.content[0].text | fromjson | .install'
```

--------------------------------

### Install Onboarding Workspace Setup Block with Bun

Source: https://www.shadcn.io/blocks/onboarding-workspace-setup

Install the Onboarding Workspace Setup block using the shadcn CLI with Bun. This command fetches the component's JSON configuration and adds it to your project.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-workspace-setup.json
```

--------------------------------

### AI Installation Prompt Example

Source: https://www.shadcn.io/icon/hugeicons-setting-done-02

An example prompt for an AI agent (like Claude Code) to install the Setting Done 02 icon using the MCP (Multi-Client Protocol). This demonstrates a streamlined installation process.

```bash
$ claude mcp add shadcnio setting-done-02
```

--------------------------------

### Install Onboarding Sample Data with npm

Source: https://www.shadcn.io/blocks/onboarding-sample-data

Use this command to install the onboarding sample data component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-sample-data.json
```

--------------------------------

### Install Onboarding Workspace Setup Block

Source: https://www.shadcn.io/blocks/onboarding-workspace-setup

Install the Onboarding Workspace Setup block using the shadcn CLI with npm. This command fetches the component's JSON configuration and adds it to your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-workspace-setup.json
```

--------------------------------

### Install Integration Segment Setup with bun

Source: https://www.shadcn.io/blocks/integration-segment-setup

Use this command to install the integration segment setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-segment-setup.json
```

--------------------------------

### Install Onboarding Department Setup with shadcn CLI (npm)

Source: https://www.shadcn.io/blocks/onboarding-department-setup

Install the Onboarding Department Setup block using the shadcn CLI with npm. This command fetches the component's JSON configuration and adds it to your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-department-setup.json
```

--------------------------------

### Install Notion Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-notion-setup

Use this command to install the Notion integration setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-notion-setup.json
```

--------------------------------

### Install Notion Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-notion-setup

Use this command to install the Notion integration setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-notion-setup.json
```

--------------------------------

### Install GitHub Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-github-setup

Use this command to install the GitHub integration setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-github-setup.json
```

--------------------------------

### Install Google Cloud Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-google-cloud-setup

Use this command to install the Google Cloud integration setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-google-cloud-setup.json
```

--------------------------------

### Install Blog Step By Step Component (bun)

Source: https://www.shadcn.io/blocks/blog-step-by-step

Use this command to add the component to your project with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/blog-step-by-step.json
```

--------------------------------

### Install Onboarding Workspace Setup Block with pnpm

Source: https://www.shadcn.io/blocks/onboarding-workspace-setup

Install the Onboarding Workspace Setup block using the shadcn CLI with pnpm. This command fetches the component's JSON configuration and adds it to your project.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-workspace-setup.json
```

--------------------------------

### Install Onboarding Department Setup with shadcn CLI (pnpm)

Source: https://www.shadcn.io/blocks/onboarding-department-setup

Install the Onboarding Department Setup block using the shadcn CLI with pnpm. This command fetches the component's JSON configuration and adds it to your project.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-department-setup.json
```

--------------------------------

### Install Onboarding Tour with bun

Source: https://www.shadcn.io/blocks/onboarding-tour

Use this command to install the Onboarding Tour component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-tour.json
```

--------------------------------

### Install Onboarding Tour with npm

Source: https://www.shadcn.io/blocks/onboarding-tour

Use this command to install the Onboarding Tour component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-tour.json
```

--------------------------------

### Install Onboarding Sample Data with pnpm

Source: https://www.shadcn.io/blocks/onboarding-sample-data

Use this command to install the onboarding sample data component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-sample-data.json
```

--------------------------------

### Install Onboarding Theme Picker with bun

Source: https://www.shadcn.io/blocks/onboarding-theme-picker

Install the theme picker block using the shadcn CLI with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-theme-picker.json
```

--------------------------------

### Install Stepper Account Setup with pnpm

Source: https://www.shadcn.io/blocks/stepper-account-setup

Use this command to install the Stepper Account Setup component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/stepper-account-setup.json
```

--------------------------------

### Install Stepper Account Setup with npm

Source: https://www.shadcn.io/blocks/stepper-account-setup

Use this command to install the Stepper Account Setup component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/stepper-account-setup.json
```

--------------------------------

### Install Onboarding Permissions Setup Block

Source: https://www.shadcn.io/blocks/onboarding-permissions-setup

Use the shadcn CLI to add the onboarding permissions setup block to your project. This command fetches the necessary components and configurations.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-permissions-setup.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-permissions-setup.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-permissions-setup.json
```

--------------------------------

### Install Onboarding Workspace Setup Block with Yarn

Source: https://www.shadcn.io/blocks/onboarding-workspace-setup

Install the Onboarding Workspace Setup block using the shadcn CLI with Yarn. This command fetches the component's JSON configuration and adds it to your project.

```bash
yarn dlx shadcn@latest add https://www.shadcn.io/r/onboarding-workspace-setup.json
```

--------------------------------

### Install Blog Step By Step Component (npm)

Source: https://www.shadcn.io/blocks/blog-step-by-step

Use this command to add the component to your project with npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/blog-step-by-step.json
```

--------------------------------

### Install Onboarding Plugin with bun

Source: https://www.shadcn.io/blocks/onboarding-plugin-install

Use this command to install the onboarding plugin using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-plugin-install.json
```

--------------------------------

### Install Onboarding Help Center with bun

Source: https://www.shadcn.io/blocks/onboarding-help-center

Use this command to add the Onboarding Help Center component to your project using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-help-center.json
```

--------------------------------

### Install Onboarding Theme Picker with npm

Source: https://www.shadcn.io/blocks/onboarding-theme-picker

Install the theme picker block using the shadcn CLI with npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-theme-picker.json
```

--------------------------------

### Add Changelog Migration Guide Component using bun

Source: https://www.shadcn.io/blocks/changelog-migration-guide

Install the changelog migration guide component using the shadcn CLI with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/changelog-migration-guide.json
```

--------------------------------

### Install Onboarding Welcome Block with bun

Source: https://www.shadcn.io/blocks/onboarding-welcome

Use this command to add the onboarding-welcome block to your project using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-welcome.json
```

--------------------------------

### Install Twilio Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-twilio-setup

Use this command to install the Twilio integration setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-twilio-setup.json
```

--------------------------------

### Install Twilio Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-twilio-setup

Use this command to install the Twilio integration setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-twilio-setup.json
```

--------------------------------

### Install Dialog Onboarding Welcome with bun

Source: https://www.shadcn.io/blocks/dialog-onboarding-welcome

Use this command to install the Dialog Onboarding Welcome component using bun. Ensure you have Node.js and bun installed.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/dialog-onboarding-welcome.json
```

--------------------------------

### Install Product Card Quick View

Source: https://www.shadcn.io/blocks/product-card-quick-view

Install the product card quick view component using the shadcn CLI. Choose the package manager that suits your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/product-card-quick-view.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/product-card-quick-view.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/product-card-quick-view.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/product-card-quick-view.json
```

--------------------------------

### Install Twilio Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-twilio-setup

Use this command to install the Twilio integration setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-twilio-setup.json
```

--------------------------------

### Install Slack Integration Setup with shadcn CLI (bun)

Source: https://www.shadcn.io/blocks/integration-slack-setup

Use this command to add the Slack integration setup block to your project using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-slack-setup.json
```

--------------------------------

### Install Dialog Onboarding Welcome with npm

Source: https://www.shadcn.io/blocks/dialog-onboarding-welcome

Use this command to install the Dialog Onboarding Welcome component using npm. Ensure you have Node.js and npm installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/dialog-onboarding-welcome.json
```

--------------------------------

### Install Integration Segment Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-segment-setup

Use this command to install the integration segment setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-segment-setup.json
```

--------------------------------

### Install Integration Segment Setup with npm

Source: https://www.shadcn.io/blocks/integration-segment-setup

Use this command to install the integration segment setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-segment-setup.json
```

--------------------------------

### Install Team Video Introductions with npm

Source: https://www.shadcn.io/blocks/team-video-introductions

Use this command to add the Team Video Introductions component to your project using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/team-video-introductions.json
```

--------------------------------

### Install Mailchimp Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-mailchimp-setup

Use this command to install the Mailchimp integration setup block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-mailchimp-setup.json
```

--------------------------------

### Install Any Icon from shadcn.io via MCP

Source: https://www.shadcn.io/icon/heroicons-solid-bolt

Example command to install any of the 285,000+ icons available on shadcn.io using an MCP-ready AI agent. This demonstrates the flexibility of the MCP tool.

```bash
`claude mcp add shadcnio <icon-name>`
```

--------------------------------

### Install Mailchimp Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-mailchimp-setup

Use this command to install the Mailchimp integration setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-mailchimp-setup.json
```

--------------------------------

### Install Mailchimp Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-mailchimp-setup

Use this command to install the Mailchimp integration setup block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-mailchimp-setup.json
```

--------------------------------

### Install Product Card Course with bun

Source: https://www.shadcn.io/blocks/product-card-course

Use this command to install the Product Card Course component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/product-card-course.json
```

--------------------------------

### Example Prompt for Fetching and Installing a Brand Icon

Source: https://www.shadcn.io/mcp/tools/get-icon

This prompt instructs an AI to fetch a brand icon from a specific library and install it. It showcases the flexibility of the get_icon tool for various icon sources.

```text
use shadcnio to fetch the github brand icon from simple-icons and install it
```

--------------------------------

### Install Onboarding Plan Selection with npm

Source: https://www.shadcn.io/blocks/onboarding-plan-selection

Use this command to install the onboarding plan selection block using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-plan-selection.json
```

--------------------------------

### Install Onboarding Mentor Match Block

Source: https://www.shadcn.io/blocks/onboarding-mentor-match

Install this component using the shadcn CLI. Ensure you have the CLI installed globally.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-mentor-match.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-mentor-match.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-mentor-match.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-mentor-match.json
```

--------------------------------

### Install GitHub Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-github-setup

Use this command to install the GitHub integration setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-github-setup.json
```

--------------------------------

### Install Onboarding Backup Config with bun

Source: https://www.shadcn.io/blocks/onboarding-backup-config

Use this command to install the backup configuration component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-backup-config.json
```

--------------------------------

### Install Onboarding Video Intro with shadcn CLI

Source: https://www.shadcn.io/blocks/onboarding-video-intro

Use the shadcn CLI to add the Onboarding Video Intro component to your project. This command fetches the component's configuration and code.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-video-intro.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-video-intro.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-video-intro.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-video-intro.json
```

--------------------------------

### Install Onboarding Plan Selection with bun

Source: https://www.shadcn.io/blocks/onboarding-plan-selection

Use this command to install the onboarding plan selection block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-plan-selection.json
```

--------------------------------

### Install Onboarding Help Center with npm

Source: https://www.shadcn.io/blocks/onboarding-help-center

Use this command to add the Onboarding Help Center component to your project using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-help-center.json
```

--------------------------------

### Install Onboarding Welcome Block with npm

Source: https://www.shadcn.io/blocks/onboarding-welcome

Use this command to add the onboarding-welcome block to your project using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-welcome.json
```

--------------------------------

### Install Onboarding Goal Setting Block with bun

Source: https://www.shadcn.io/blocks/onboarding-goal-setting

Install the onboarding goal setting block using the shadcn CLI with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-goal-setting.json
```

--------------------------------

### Install Google Cloud Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-google-cloud-setup

Use this command to install the Google Cloud integration setup block using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-google-cloud-setup.json
```

--------------------------------

### Install Team Video Introductions with bun

Source: https://www.shadcn.io/blocks/team-video-introductions

Use this command to add the Team Video Introductions component to your project using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/team-video-introductions.json
```

--------------------------------

### Install Dialog Two Factor Setup with bun

Source: https://www.shadcn.io/blocks/dialog-two-factor-setup

Use this command to install the Dialog Two Factor Setup component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/dialog-two-factor-setup.json
```

--------------------------------

### Install Onboarding Learning Path with bun

Source: https://www.shadcn.io/blocks/onboarding-learning-path

Use this command to add the Onboarding Learning Path component to your project using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-learning-path.json
```

--------------------------------

### Install Kanban Startup Pipeline with bun

Source: https://www.shadcn.io/blocks/kanban-startup-pipeline

Use this command to install the Kanban Startup Pipeline block using bun. Ensure you have bunx available.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/kanban-startup-pipeline.json
```

--------------------------------

### Install Dialog Two Factor Setup with pnpm

Source: https://www.shadcn.io/blocks/dialog-two-factor-setup

Use this command to install the Dialog Two Factor Setup component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/dialog-two-factor-setup.json
```

--------------------------------

### Install Dialog Two Factor Setup with npm

Source: https://www.shadcn.io/blocks/dialog-two-factor-setup

Use this command to install the Dialog Two Factor Setup component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/dialog-two-factor-setup.json
```

--------------------------------

### Install Onboarding Tour with pnpm

Source: https://www.shadcn.io/blocks/onboarding-tour

Use this command to install the Onboarding Tour component using pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-tour.json
```

--------------------------------

### Install Onboarding Theme Picker with pnpm

Source: https://www.shadcn.io/blocks/onboarding-theme-picker

Install the theme picker block using the shadcn CLI with pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/onboarding-theme-picker.json
```

--------------------------------

### Example File Additions

Source: https://www.shadcn.io/blocks

This output indicates the successful addition of UI component files to your project.

```bash
✓ Added · components/ui/hero-split-image.tsx

✓ Added · components/ui/pricing-comparison-table.tsx

✓ Added · components/ui/faq-categorized.tsx

✓ Landing page shipped. 3 minutes, not 3 days.
```

--------------------------------

### Install Onboarding Goal Setting Block with npm

Source: https://www.shadcn.io/blocks/onboarding-goal-setting

Install the onboarding goal setting block using the shadcn CLI with npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-goal-setting.json
```

--------------------------------

### AI Installation Prompt Example

Source: https://www.shadcn.io/icon/jam-arrows-h

Example prompt for an AI agent (like Claude Code) to install the Arrows H icon using the MCP protocol.

```bash
$ claude mcp add shadcnio arrows-h
```

--------------------------------

### Install Datadog Integration Setup with shadcn CLI (bun)

Source: https://www.shadcn.io/blocks/integration-datadog-setup

Use this command to install the Datadog integration setup block using bun with the shadcn CLI.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-datadog-setup.json
```

--------------------------------

### Install Product Card Ebook with bun

Source: https://www.shadcn.io/blocks/product-card-ebook

Use this command to install the Product Card Ebook component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/product-card-ebook.json
```

--------------------------------

### Install Datadog Integration Setup with shadcn CLI (pnpm)

Source: https://www.shadcn.io/blocks/integration-datadog-setup

Use this command to install the Datadog integration setup block using pnpm with the shadcn CLI.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-datadog-setup.json
```

--------------------------------

### Install Skeleton Onboarding Wizard with bun

Source: https://www.shadcn.io/blocks/skeleton-onboarding-wizard

Use this command to install the Skeleton Onboarding Wizard component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/skeleton-onboarding-wizard.json
```

--------------------------------

### Install Onboarding Budget Allocation with bun

Source: https://www.shadcn.io/blocks/onboarding-budget-allocation

Use this command to install the Onboarding Budget Allocation component using bun. Ensure you have Node.js and bun installed.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-budget-allocation.json
```

--------------------------------

### Install Datadog Integration Setup with shadcn CLI (npm)

Source: https://www.shadcn.io/blocks/integration-datadog-setup

Use this command to install the Datadog integration setup block using npm with the shadcn CLI.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-datadog-setup.json
```

--------------------------------

### Install Map Neighborhood Guide Block

Source: https://www.shadcn.io/blocks/map-neighborhood-guide

Install the map neighborhood guide block using the shadcn CLI. This command fetches the block's JSON configuration and adds it to your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/map-neighborhood-guide.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/map-neighborhood-guide.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/map-neighborhood-guide.json
```

--------------------------------

### Install Settings Onboarding Flow with bun

Source: https://www.shadcn.io/blocks/settings-onboarding-flow

Use this command to install the settings onboarding flow component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/settings-onboarding-flow.json
```

--------------------------------

### Install Map City Guide Block

Source: https://www.shadcn.io/blocks/map-city-guide

Use the shadcn CLI to add the Map City Guide block to your project. This command fetches the block configuration and installs necessary dependencies.

```bash
npx shadcn@latest add https://www.shadcn.io/r/map-city-guide.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/map-city-guide.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/map-city-guide.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/map-city-guide.json
```

--------------------------------

### Install Blog Step By Step Component (pnpm)

Source: https://www.shadcn.io/blocks/blog-step-by-step

Use this command to add the component to your project with pnpm.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/blog-step-by-step.json
```

--------------------------------

### Install Zendesk Integration Setup with shadcn CLI

Source: https://www.shadcn.io/blocks/integration-zendesk-setup

Use this command to add the Zendesk integration setup block to your project via the shadcn CLI. Ensure you have Node.js and npm/yarn/pnpm/bun installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-zendesk-setup.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-zendesk-setup.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-zendesk-setup.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-zendesk-setup.json
```

--------------------------------

### Install Billing Setup Fee Breakdown Component

Source: https://www.shadcn.io/blocks/billing-setup-fee-breakdown

Install the billing setup fee breakdown component using the shadcn CLI. This command is compatible with npm, yarn, pnpm, and bun.

```bash
npx shadcn@latest add https://www.shadcn.io/r/billing-setup-fee-breakdown.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/billing-setup-fee-breakdown.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/billing-setup-fee-breakdown.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/billing-setup-fee-breakdown.json
```

--------------------------------

### Install Onboarding Plugin with npm

Source: https://www.shadcn.io/blocks/onboarding-plugin-install

Use this command to install the onboarding plugin using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-plugin-install.json
```

--------------------------------

### Install Arrow Right Start On Rectangle Solid with shadcn CLI

Source: https://www.shadcn.io/icon/heroicons-arrow-right-start-on-rectangle-solid

Use the shadcn CLI to add the Arrow Right Start On Rectangle Solid icon to your project. This command installs the icon from HeroIcons.

```bash
$ claude mcp add shadcnio arrow-right-start-on-rectangle-solid
```

--------------------------------

### Install Web Preview Component with bun

Source: https://www.shadcn.io/ai/web-preview

Use this command to install the web-preview component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/web-preview.json
```

--------------------------------

### Install Footer Product Showcase with bun

Source: https://www.shadcn.io/blocks/footer-product-showcase

Use this command to install the Footer Product Showcase component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/footer-product-showcase.json
```

--------------------------------

### Install Onboarding Budget Allocation with npm

Source: https://www.shadcn.io/blocks/onboarding-budget-allocation

Use this command to install the Onboarding Budget Allocation component using npm. Ensure you have Node.js and npm installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-budget-allocation.json
```

--------------------------------

### Install Onboarding Migration Wizard with bun

Source: https://www.shadcn.io/blocks/onboarding-migration-wizard

Use this command to install the Onboarding Migration Wizard component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/onboarding-migration-wizard.json
```

--------------------------------

### Install Onboarding Backup Config with npm

Source: https://www.shadcn.io/blocks/onboarding-backup-config

Use this command to install the backup configuration component using npm.

```bash
npx shadcn@latest add https://www.shadcn.io/r/onboarding-backup-config.json
```

--------------------------------

### AI Prompt for Icon Installation

Source: https://www.shadcn.io/icon/lucide-axis-3d

Use an AI agent like Claude Code with MCP to install icons. This example shows how to prompt the AI to search for and install icons.

```bash
$ claude mcp add shadcnio axis-3d
```

--------------------------------

### Install Product Card Recommendation with bun

Source: https://www.shadcn.io/blocks/product-card-recommendation

Use this command to install the product card recommendation component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/product-card-recommendation.json
```

--------------------------------

### Prompt AI to install Angular Guard

Source: https://www.shadcn.io/icon/catppuccin-angular-guard

Example prompt for an AI agent like Claude Code to install the Angular Guard icon. The AI discovers and installs resources from shadcn.io.

```bash
`claude mcp add shadcnio @catppuccin/icons/angular-guard`
```

--------------------------------

### Example Usage in Angular

Source: https://www.shadcn.io/icon/octicon-bookmark

Provides an example of how to import and use the Bookmark icon component in an Angular application. This requires shadcn/ui setup.

```typescript
import { Component } from '@angular/core';
import { Bookmark } from 'icons/bookmark';

@Component({
  selector: 'app-my-component',
  standalone: true,
  imports: [Bookmark],
  template: '<Bookmark />',
})
export class MyComponent {}

```

--------------------------------

### Example usage in HTML

Source: https://www.shadcn.io/icon/clarity-caravan-solid

This is a basic example of how to include the Caravan Solid icon in your HTML website. No specific framework setup is required.

```html
<i class="caravan-solid"></i>
```

--------------------------------

### Example Usage in Vue

Source: https://www.shadcn.io/icon/arcticons-my-sunrise

Demonstrates how to import and use the My Sunrise icon in a Vue.js component. This example assumes a setup compatible with shadcn/ui.

```vue
<script setup>
import MySunrise from '@/components/ui/icons/MySunrise.vue';
</script>

<template>
  <div>
    <MySunrise />
  </div>
</template>
```

--------------------------------

### Install Todo List Onboarding Block with npm

Source: https://www.shadcn.io/blocks/todo-list-onboarding

Use this command to install the Todo List Onboarding block using npm. Ensure you have Node.js and npm installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/todo-list-onboarding.json
```

--------------------------------

### Install Storefront Product Video Block with Bun

Source: https://www.shadcn.io/blocks/storefront-product-video

Install the storefront product video block using the shadcn CLI with bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/storefront-product-video.json
```

--------------------------------

### Install Chat Immigration Guide Component

Source: https://www.shadcn.io/blocks/chat-immigration-guide

Use the shadcn CLI to add this component to your project. Ensure you have the shadcn CLI installed.

```bash
npx shadcn@latest add https://www.shadcn.io/r/chat-immigration-guide.json
```

```bash
npx shadcn@latest add https://www.shadcn.io/r/chat-immigration-guide.json
```

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/chat-immigration-guide.json
```

```bash
bunx shadcn@latest add https://www.shadcn.io/r/chat-immigration-guide.json
```

--------------------------------

### Example Usage in Angular

Source: https://www.shadcn.io/icon/fa7-solid-mound

Provides an example of how to use the Mound icon component within an Angular application. Ensure the icon is installed.

```typescript
import { Component } from '@angular/core';
import { Mound } from '@/components/ui/icons';

@Component({
  selector: 'app-my-component',
  standalone: true,
  imports: [Mound],
  template: '<Mound />',
})
export class MyComponent {}
```

--------------------------------

### Install Product Card Language Course with bun

Source: https://www.shadcn.io/blocks/product-card-language-course

Use this command to install the product card language course component using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/product-card-language-course.json
```

--------------------------------

### Install Music Sample Library with bun

Source: https://www.shadcn.io/blocks/music-sample-library

Use this command to install the music sample library block using bun.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/music-sample-library.json
```

--------------------------------

### Example Usage in Angular

Source: https://www.shadcn.io/icon/emojione-monotone-biohazard

Provides an example of how to import and use the Biohazard icon component in an Angular application. This requires the icon to be installed.

```typescript
import { Component } from '@angular/core';
import { Biohazard } from 'icons/biohazard';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [Biohazard],
  template: `
    <div>
      <Biohazard />
      <p>Biological Hazard</p>
    </div>
  `
})
export class AppComponent {}
```

--------------------------------

### Install Todo List Onboarding Block with bun

Source: https://www.shadcn.io/blocks/todo-list-onboarding

Use this command to install the Todo List Onboarding block using bun. Ensure you have Node.js and bun installed.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/todo-list-onboarding.json
```

--------------------------------

### Install AWS Integration Setup with bun

Source: https://www.shadcn.io/blocks/integration-aws-setup

Use the shadcn CLI with bun to add the AWS Integration Setup block to your project.

```bash
bunx shadcn@latest add https://www.shadcn.io/r/integration-aws-setup.json
```

--------------------------------

### Install AWS Integration Setup with pnpm

Source: https://www.shadcn.io/blocks/integration-aws-setup

Use the shadcn CLI with pnpm to add the AWS Integration Setup block to your project.

```bash
pnpm dlx shadcn@latest add https://www.shadcn.io/r/integration-aws-setup.json
```

--------------------------------

### Install AWS Integration Setup with npm

Source: https://www.shadcn.io/blocks/integration-aws-setup

Use the shadcn CLI with npm to add the AWS Integration Setup block to your project.

```bash
npx shadcn@latest add https://www.shadcn.io/r/integration-aws-setup.json
```
Tokens:
Raw