125k

2026 年 4 月 - shadcn プリセット

shadcn CLI からのプリセット コードをデコード、共有、オープン、および解決します。

プリセット コードを操作するための shadcn preset コマンドを追加しました。

プリセットをデコードする

プリセット コードをデコードして、その内容を正確に確認できます。

pnpm dlx shadcn@latest preset decode b5owWMfJ8l
Preset
  code         b5owWMfJ8l
  version      b
  style        mira
  baseColor    mauve
  theme        mauve
  chartColor   amber
  iconLibrary  hugeicons
  font         inter
  fontHeading  oxanium
  radius       large
  menuAccent   subtle
  menuColor    inverted-translucent
  url          https://ui.shadcn.com/create?preset=b5owWMfJ8l

プロジェクトから解決する

現在の構成に一致するプリセットを確認するには、既存のプロジェクトで preset resolve を使用します。

pnpm dlx shadcn@latest preset resolve
Preset
  code         b5Kc6P0Vc
  version      b
  style        luma
  baseColor    olive
  theme        lime
  chartColor   sky
  iconLibrary  hugeicons
  font         geist
  fontHeading  inherit
  radius       default
  menuAccent   subtle
  menuColor    default
  url          https://ui.shadcn.com/create?preset=b5Kc6P0Vc

モノリポジトリでも動作します。

pnpm dlx shadcn@latest preset resolve -c apps/web

共有またはオープン

共有可能なリンクが必要な場合は、preset url を使用します。

pnpm dlx shadcn@latest preset url b5owWMfJ8l
https://ui.shadcn.com/create?preset=b5owWMfJ8l

preset open を使用して、カスタマイズのために shadcn/create でプリセットを開きます。

pnpm dlx shadcn@latest preset open b5owWMfJ8l
Opening https://ui.shadcn.com/create?preset=b5owWMfJ8l in your browser.

これにより、手動でコードをデコードしたり URL を構築したりすることなく、プリセットの検査、共有、コーディング エージェントへの引き渡しが容易になります。

プリセットを試してみる