Claude Design の最良のオープンソース代替

Open DesignThe Vibe Design Workspace

Open Design はオープンソースでローカルな vibe design workspace——すでに使っているコーディングエージェントを設計エンジンに変え、アイデアからプロトタイプ、Web、スライド、HTML 動画まで、すべて自分のマシン上で完結します。
エージェントネイティブ、21 のコーディングエージェント、129 のデザインシステム、Apache-2.0。

Open Design desktop — design files & index.html preview

Why Open Design?

Open Design agentic vibe design workspace 使LLM ————Open Design BYOKApache-2.0

デザインはデスクトップで起こる。 ローカルファイル、Figma エクスポート、コードリポジトリを直接読み取り、エージェントはターミナル実行のすべての権限を持つ。

デザインはデスクトップで起こる。
ローカルファイル、Figma エクスポート、コードリポジトリを直接読み取り、エージェントはターミナル実行のすべての権限を持つ。

あなたのマシンにある Claude Code / Codex / Cursor はすでに十分強力。 Open Design はそれらを完全なデザインワークフローにつなぎ込む。

あなたのマシンにある Claude Code / Codex / Cursor はすでに十分強力。
Open Design はそれらを完全なデザインワークフローにつなぎ込む。

すべての選択がデザインシステム・好み・記憶として蓄積され、次の生成があなたの望みに近づく。

すべての選択がデザインシステム・好み・記憶として蓄積され、次の生成があなたの望みに近づく。

アイデアからプロトタイプ、Web、スライド、HTML 動画まで

Done 👌

Brief → テンプレート → ビジュアル方向 → Artifact → 記憶の蓄積

  1. 01起点を選ぶ
  2. 02ビジュアルの方向を決める
  3. 03Artifact を生成
  4. 04納品、または動画化
目標を一言で説明するか、テンプレート / プラグインから起点を選ぶ。
方向が決まれば、カラーパレット・フォント・余白が自動で生成フローに反映される。
エージェントがすべてのコンテキストを読み、実際に動くファイルを生成。サンドボックス内で即時プレビューと編集。
エンジニアリングにエクスポートして開発を続けるか、HyperFrames でそのままマーケティング動画に。

Open Design で何が作れる?

プロトタイプ、ランディングページ、スライド、ダッシュボード、ブランド/デザインシステム、さらに HTML 動画まで。Open Design はそれぞれを実際に動くファイルに変換し、自分の coding agent で駆動、そのまま納品や開発への引き継ぎができます。

21+ のコーディングエージェントを設定ゼロで接続

各段階は反復的で、視覚的で、調査に基づきます。不透明な prompt ではなく、組み合わせ可能なファイルで進みます。

21+ のエージェントをすべて見る
ClaudeCodexGeminiCursorGitHub CopilotOpenCodeDevinHermesPiKimiKiroQwenGrokDeepSeekQoderAMRKiloAiderTraeMistral VibeMiMoAntigravityReasonix
21+ Coding Agent

世界中から、343 人のコントリビューター
が一緒に Open Design を作っています

オープンソースの vibe design workspace を数字で

Open Design 桌面端首页

最先端の AI デザイン能力を、すべての作り手の手元へ

Open · Local · Agent-native

Open Design のよくある質問 — オープンソース・ローカルファースト・Claude Design 代替

デスクトップをダウンロード

74K+ スター · Apache-2.0 · 無料

  1. 01Open Design はオープンソースの Claude Design 代替ですか?

    はい——Open Design はオープンソースかつローカル優先の Claude Design 代替です。Claude Design はクローズドでホスト型、Anthropic モデルに固定されていますが、Open Design は Apache-2.0 で自分のマシン上で動き、BYOK。Claude Code、Codex、Cursor、Gemini、OpenCode、Qwen で駆動でき、生成物はすべて自分のファイルとして手元に残ります。

    詳しく見る →

  2. 02vibe design workspace とは?

    vibe design workspace とは、要素を一つずつ手で配置する代わりに、AI エージェントに意図を伝えて設計する場です——prompt からプロトタイプ、Web ページ、スライド、HTML 動画まで。Open Design はオープンソースで agent-native な vibe design workspace で、すでに使っているコーディングエージェントを完全な設計ワークフローに組み込み、ひとつのツールでラフなアイデアから自分のものになる完成物まで導きます。

    詳しく見る →

  3. 03Open Design とは何ですか?

    Open Design は nexu-io/open-design プロジェクト公式のオープンソース AI デザインワークスペースです。Claude Code、Codex、Cursor、Gemini CLI、OpenCode、Qwen などのローカル coding agent を、スキルと DESIGN.md システムで動くデザインエンジンにします。

  4. 04Open Design は公式ですか?

    はい。公式サイトは https://open-design.ai/、ソースコードは GitHub の https://github.com/nexu-io/open-design です。"Open Design"、"OpenDesign"、"open-design"、"Open Design AI" は同じプロジェクトを指します。

  5. 05Claude Design と何が違いますか?

    Claude Design は単一ベンダーに紐づくホスト型製品です。Open Design はローカル優先、Apache-2.0 のオープンソース、BYOK で、自分の agent、鍵、DESIGN.md を使います。

  6. 06ローカルで動きますか?

    はい。デスクトップアプリ、daemon、スキル runtime はすべて自分のマシン上で動き、生成物はプロジェクトディレクトリに保存されます。

  7. 07対応している coding agent は?

    Claude Code、Codex、Cursor、Gemini CLI、OpenCode、Qwen と、同じ skill protocol を話す adapter に対応します。

  8. 08セルフホストや fork はできますか?

    できます。Apache-2.0 のコードなので、repo を fork し、skill を編集し、独自の DESIGN.md システムを追加できます。

  9. 09データは Anthropic、OpenAI、Google に送られますか?

    送られるのは、あなたが鍵を持ち込んだ(BYOK)プロバイダーへの prompt とスキルのコンテキストだけです。Open Design 自身のサーバーはなく、daemon があなたのプロバイダーと直接通信します。生成物はベンダーのクラウドではなく、プロジェクトディレクトリにファイルとして保存されます。

  10. 10CLI やデスクトップアプリなしで使えますか?

    現時点では使えません。Open Design は設計からローカル優先で、最低限ローカル daemon と agent(Claude Code、Codex、Cursor、Gemini CLI、または対応する 17 の adapter のいずれか)が必要です。ホスト型サンドボックスはロードマップにありますが優先事項ではありません。自分の repo にある artifact は、他人のデータベースにあるドキュメントに勝ります。

  11. 11Open Design の料金は?

    プロダクト自体は無料で Apache-2.0 です。Open Design のサブスクリプションはありません。支払うのは利用するプロバイダー(Anthropic、OpenAI、Google、Mistral、xAI、Moonshot など)の API 料金だけで、あなたのアカウントに直接請求されます。BYOK により、鍵も支出もあなたの側に残ります。

  12. 12Vercel、Cloudflare、自前サーバーでセルフホストできますか?

    できます。daemon は Node 24 が動く場所ならどこでも動き、ランディングページは静的な Astro ビルドなので Cloudflare Pages、Vercel、Netlify にそのままデプロイできます。共有運用するチームは通常、ネットワーク内のマシンに daemon を固定し、各開発者の CLI をそこに向けます。

  13. 13自分のブランドを Open Design に持ち込むには?

    スクリーンショットか Figma エクスポートを Web UI に投げ込み、agent にブランドを DESIGN.md ファイルへ抽出させます。そのファイルを repo の design-systems/<your-brand>/ に保存すれば、以後すべてのスキルが再プロンプトなしでそのブランドでレンダリングします。/alternatives/claude-design/ に同じ流れがステップ形式で書かれています。

  14. 14作業をやり直さずに agent を切り替えられますか?

    できます。スキルと DESIGN.md システムは agent 非依存で、同じ SKILL.md が Claude Code、Codex、Cursor、Gemini CLI、GitHub Copilot、Grok、Hermes、Qwen など対応 adapter のどれでもレンダリングされます。agent の切り替えは daemon の設定変更であり、デザインのやり直しではありません。

  15. 15Open Design のロードマップは?

    最新のロードマップは GitHub repo の docs/roadmap.md にあり、週次のリリースノートは GitHub Releases で公開されます。次の四半期の主なテーマは、agent adapter の追加、テンプレートファミリーの拡充(3D・動画・音声)、デザインチーム向けのオプションの共有 daemon モードです。