Wonder は、キャンバスとコードを同じ成果物として扱う AI デザインツールです。画面・バリアント・フローをテキストで指示すると編集可能なレイヤーとして生成され、各要素は 1:1 で本番投入できる React と Tailwind に対応します。スペースの調整、画像差し替え、コピー編集、テーマの再生成といった操作はすべてキャンバス上で行われ、コードも同期して更新されるため、従来のような設計から実装への受け渡しが不要になります。

さらに MCP サーバー経由で Claude Code や Cursor、Codex といったコーディングエージェントと接続でき、既存リポジトリのコンポーネントやデザイントークンをキャンバスに取り込み、仕上げたデザインをそのままコードへ反映できます。現在パブリックアルファ版で、有料プランは月 $20 から $200 まで、自前のコーディングエージェントを接続する場合は無料プランも用意されています。