世界を動かす技術を、日本語で。

Shadcn/UIはRadixの代わりにBase UIをデフォルトに設定しました

2026年7月5日原文(ui.shadcn.com)

概要

  • shadcn/ui は2026年7月から Base UI をデフォルトコンポーネントライブラリとして採用
  • Radix も引き続きサポートし、両方のライブラリを選択可能
  • チャットインターフェース向け新コンポーネント群や GitHubレジストリ 対応を追加
  • shadcn eject コマンドでCSS依存をプロジェクトにインライン化可能
  • 新スタイル Rhea を導入し、よりコンパクトなUIを実現

2026年7月 - Base UIがデフォルトに

  • shadcn/ui のデフォルトコンポーネントライブラリを Base UI に変更
    • Radix は引き続き利用・サポート
  • Base UI はRadix開発陣による新ライブラリ
    • 1.6.0で安定版、週600万+ダウンロード実績
  • shadcn initshadcn/create でBase UIが初期選択肢に
    • ドキュメントもBase UIがデフォルト表示
  • 既存プロジェクトで Radix 継続利用も問題なし
    • 新規プロジェクトはBase UI推奨
  • Radix を明示的に選びたい場合は-b radixフラグで指定可能
  • マイグレーション不要
    • 移行したい場合は 1コンポーネントずつ段階的に移行可能
    • AIエージェント によるマイグレーション支援
      • コード差分や注意点をレポート化
      • カスタマイズも反映、git履歴もクリーン維持

2026年6月 - チャットインターフェース向け新コンポーネント

  • MessageScroller, Message, Bubble, Attachment, Marker を新規追加
    • チャットUIの会話層を構成
  • MessageScroller
    • スクロール管理、履歴復元、メッセージジャンプなど高度な挙動を提供
    • @shadcn/react でヘッドレスコンポーネントとしても利用可能
  • Bubble, Attachment, Marker などを組み合わせて多様なチャットUI実現
  • 新CSSユーティリティ
    • scroll-fade: スクロール端のフェード効果
    • shimmer: ライブステータス用テキストシマー
    • どちらも shadcn/tailwind.css に同梱
  • AI Elements との互換性維持
    • 既存AI Elementsユーザーは移行不要、必要に応じて新コンポーネント利用推奨

2026年6月 - GitHubレジストリ対応

  • 任意のGitHub公開リポジトリ をレジストリとして利用可能
    • ルートに registry.json を配置し、配布アイテムを定義
  • shadcn CLIでGitHubレジストリから直接インストール可能
  • 配布対象は コンポーネント以外にも多岐に対応
    • フック、ユーティリティ、デザイントークン、CI設定、テンプレート等
  • registry.jsonの例
    • 複数ファイルや設定を一括配布
  • 既存のCLIコマンドでリスト表示・検索・インストールが可能

2026年5月 - shadcn ejectコマンド

  • shadcn/tailwind.css の依存をプロジェクトCSSにインライン化
    • 依存パッケージを削除し、カスタマイズや運用の柔軟性向上
  • コマンド実行前後でCSS構成が変化
    • @importからインラインCSSへ
  • monorepo にも対応、各ワークスペースで実行可能

2026年5月 - 新スタイル「Rhea」登場

  • Rhea はLumaを基にした よりコンパクトな新スタイル
    • スペースを抑え、情報密度を高めたUI設計
  • ボタン・入力・メニュー・カード・リスト等でより狭い間隔と小型コントロールを実現
  • プロダクト向けに最適化されたデザイン選択肢

質問や詳細な解説が必要な場合はご連絡ください。

Hackerたちの意見

いいね!最初に9uiを通じてBase UIを使い始めたけど、プライミティブがすごく扱いやすくて、特に他のBase UIコンポーネントから複雑なコンポーネントを作りたいときに便利だったよ。Shadが今頼ってる依存関係を減らせるといいな。

何が違うの?どのコンポーネントライブラリも同じに見えるんだけど。

コードモッドからLLMを使った移行作業に移るのは面白い進展だね。たとえLLMがもっと決定的だとしても、コードモッドの時代は終わりに近づいてるのかな。

二つは完璧に補完し合ってると思うし、これからもそうだろうね。ソフトルール用にAGENTS.mdファイルを書き続けてるし、ハードルール用のカスタムリンターも作ってるけど、これが両方のいいとこ取りだと思う。

LLMを活用して決定的なコードモッドを作るのはどう?それを実行して他の決定的なガードレールを使って反復して、結果をLLMにフィードバックしてコードモッドを改善するっていうのもありかも。

ごめん、ここでのcodemodって何?

TFAのフレーミングは危険な考え方だね。Codemodsはどうでもいいけど、あってもなくてもいい。求めてるのはLLM用のスキルファイルじゃないよ。人間向けのドキュメントを書けばいいんだ。人間向けの移行ガイドを書こうよ。スキルファイルとドキュメントが同じものであるべきだって気づくのに時間がかかるだろうけど。

Shadcnを使ったことがあって、だいたい好きなんだけど、Radixベースのラジオボタンはちょっとやりすぎかな。他の選択肢も同様に、過剰な解決策が使われてるところがあるね。

Shadcnや最近のUIライブラリに対する不満は、何度も同じことを繰り返してる感じがすることかな。今、サイドプロジェクトでArk UIを試してるんだけど、結構使えるコンポーネントがあって、例えばタグ入力とかね。https://ark-ui.com/docs/components/tags-input あと、アニメーション付きのアクティブ要素インジケーターがあるタブ/「セグメントグループ」コンポーネントもあって、これを実装するのはちょっと難しそう。https://ark-ui.com/docs/components/segment-group それに、やたら複雑な「クリックでコピー」ボタンとか、再実装されたものもあって、https://ark-ui.com/docs/components/clipboard, https://ark-ui.com/docs/components/collapsible マークアップが冗長で、divのスープみたいになっちゃってる。

退屈なアプリケーションについてだけど、みんなはshadcnのコピペアプローチを好むのかな?それとも伝統的なUIライブラリ(例えばmantine)の方がいい?コピペアプローチは簡単に修正できるけど、新たな問題も生むよね。例えば、単にバージョン番号を上げるだけのものに対して、アップグレード用のAIエージェントが必要になったり。

Mantineは素晴らしいよ。すぐに何でも作れるし、テーマや個々のコンポーネントを完全にカスタマイズすることもできる。ただ、学習曲線はあるね。でも、そんなに急なものではないと思う。

新しいプロジェクトではベンダリングに傾いてるかな。市販のUIライブラリを使うのは短期的には簡単だけど、通常は複雑すぎて、必要ない機能が実装されてたり、同じライブラリを使ってる他のアプリと差別化したいときに調整が難しかったりする。アップグレードすることに決めたときには、すべての調整が微妙に壊れちゃうし。自分のUIライブラリを作るのが一番いいアプローチだと思う。自分のものだから、いろんなプロジェクトで再利用できるし、同じビジュアルスタイルを維持できるし(必要なら)、必要なときに機能を追加できる。

Hacker Newsで議論の続きを見る