v0とは？使い方・料金・プロンプト術【2026年】

公開日：2026-09-10

「v0」というAIツールの名前を見聞きしたものの、何ができるのか、日本語で使えるのか、料金はどれくらいかかるのか、気になっている方は多いのではないでしょうか。v0は、Vercelが提供する、自然言語のプロンプトからUIやフルスタックのWebアプリのコードを生成するAIエージェントです。本記事では、v0の基本的な仕組みから料金プラン、使い方、日本語プロンプトのコツ、商用利用の考え方まで、公式情報をもとに順を追って解説します。

v0とは？Vercelが提供するAIエージェントの基本

v0とは、Vercelが提供する、自然言語のプロンプトからUIやフルスタックのWebアプリケーションのコードを生成するAIエージェントです。「こういう画面が欲しい」という言葉での指示だけで、実際に動くコードの土台を作ってくれる点が特徴です。

生成されるコードは、React・Next.jsをベースに、スタイリングにTailwind CSS、UIパーツにshadcn/uiを組み合わせた構成が標準となっています。すでにReactやNext.jsに触れたことがある人であれば、生成後のコードをそのまま自分のプロジェクトに組み込みやすい設計と言えます。

もともとは「v0.dev」というドメイン・ブランドで提供されていましたが、2025年8月に「v0.app」へ移行しました。その後2026年2月には、公式で「The New v0」として、データベース接続やGitHub連携といったフルスタックの機能が拡充されています。単なるデザインカンプ生成ツールにとどまらず、実際に動くアプリケーションの開発を支援するツールへと進化してきた経緯を押さえておくと、後述する料金プランや使い方の理解もスムーズになります。

ここでいう「AIエージェント」とは、チャット形式で一問一答するだけのAIとは異なり、指示内容をもとにコードの生成・修正・プレビューまでを一連の作業として自律的に進めてくれるAIの総称です。v0の場合は、この一連の流れがUIやアプリケーションのコード生成に特化している点が特徴と言えます。

なお、React・Next.jsは、いずれもWebアプリケーションを構築するためのJavaScriptの技術（フレームワーク・ライブラリ）です。本記事に登場する技術用語は、クリエイティブ用語辞典でも確認できます。

v0でできること｜UI生成からフルスタック開発まで

v0を使うと何ができるのか、具体的に見ていきましょう。

中心となるのは、自然言語のプロンプトからUIコンポーネントを生成する機能です。「シンプルなログイン画面を作って」「カード型の料金表を3列で並べて」といった指示を出すと、React/Next.js・Tailwind CSS・shadcn/uiで構成されたコードが生成され、ブラウザ上でプレビューを確認しながら調整できます。

さらに「The New v0」では、UI生成にとどまらずデータベース接続やGitHub統合など、フルスタックの開発機能へと対応範囲が広がっています。GitHubと連携すれば、生成したコードをリポジトリに反映し、Vercel上へワンクリックでデプロイする、という流れも組みやすくなっています。

ここで押さえておきたいのは、v0が生成するのはあくまで「たたき台」であるという点です。生成されたUIをそのまま公開するのではなく、実際のユーザーにとって使いやすいかどうかを見極め、レイアウトや導線を整えるには、UI/UXデザインの知識が役立ちます。ボタンの配置や文字サイズ、余白の取り方といった細部は、生成された時点では最適化しきれていないことも多く、人の目で確認しながら調整する工程が欠かせません。UI/UXデザイン専攻のように、設計の基礎を体系的に学べる講座を活用するという選択肢もあります。

v0の料金プランを整理（無料〜Enterprise）

v0の料金プランは、公式情報（2026年9月時点）によれば、無料のFreeプランから法人向けのEnterpriseプランまで、次のように整理されています。

v0公式料金ページ（2026年9月時点）にもとづく。米ドル建て表示・為替換算なし。料金は変更される場合があるため、契約前に公式サイトで最新情報を確認してください。

また、月内に使い切らなかったクレジットは翌請求サイクルに繰り越せますが、65日で失効する点にも注意が必要です。特にPremiumプランは新規提供の終了が進んでいる段階のため、これから使い始める場合はFree・Plus・Businessのいずれかが選択肢の中心になると考えられます。

まずはFreeプランの範囲でどの程度のことができるかを試し、本格的に使う頻度が増えてきた段階で有料プランへの移行を検討する、という進め方が無理のない選択肢のひとつです。

v0の使い方｜利用開始から公開までの流れ

ここでは、v0を使い始めてから公開までの一般的な流れを紹介します。

1. アカウントを登録する：v0公式サイトからアカウントを作成し、ログインします。
2. 日本語でプロンプトを入力する：作りたい画面のイメージを、日本語の文章で入力します。最初は「問い合わせフォームを作って」のようなシンプルな指示から試すのが一般的です。
3. プレビューを確認し、修正を指示する：生成されたUIをブラウザ上で確認し、「配色を落ち着いた色にして」「ボタンを右上に移動して」のように、追加のプロンプトで少しずつ調整していきます。
4. GitHubと連携し、Vercelへデプロイする：仕上がったコードをGitHubリポジトリに反映し、Vercelへのデプロイまで進めることができます。

いきなり複雑な要件を一度に伝えるのではなく、小さな単位で指示を出し、都度プレビューで確認しながら進めるほうが、意図したUIに近づけやすいという特徴があります。修正の指示も、変更してほしい箇所と方向性を具体的に伝えると、意図が伝わりやすくなります。次の章では、この「指示の出し方」、つまり日本語プロンプトのコツをもう少し詳しく見ていきます。

日本語プロンプトのコツ｜Before/Afterで解説

v0を使いこなすうえで大きな差が出るのが、プロンプト（指示文）の書き方です。ここではBefore/Afterの形で、指示を具体化するポイントを紹介します。

このように、ターゲット・構成要素・配色・トーンなど、伝えたい条件を具体的に言語化するほど、意図に近いUIが生成されやすくなります。反対に「かっこいい」「おしゃれ」といった抽象的な言葉だけでは、AIの解釈にばらつきが出やすくなります。

もう一つのコツは、一度にすべてを求めず、段階的に指示を出すことです。まず全体のレイアウトを固め、その後で配色、次に細部のスペーシングというように分けて調整すると、修正の意図が伝わりやすくなります。

なお、v0の公式ポリシーでは、生成されたコードや文言をそのまま採用するのではなく、人によるレビューを組み合わせることが推奨されています。生成結果には、他のユーザーや第三者の権利物と類似する内容や、不完全な記述・不具合が含まれる可能性がある旨も明記されています。プロンプトの工夫だけでなく、出力を確認・修正する視点もあわせて持っておくことが大切です。プロンプト設計を基礎から体系的に学びたい場合は、AI総合クリエイティブ講座のような講座を活用する方法もあります。

v0の商用利用は可能？公式ポリシーを確認

v0で生成したコードやデザインを、仕事やサービスに使ってよいのか気になる方も多いはずです。v0のAIポリシー（v0.app/policy）を確認すると、生成物の商用利用を一律に禁止する条項は明記されていません。

ただし、公式ポリシーでは、商用利用にあたって人によるレビューを組み合わせ、知的財産権の侵害やバグ、機密情報の漏えいといったリスクを軽減することが推奨されています。また、出力が他のユーザーや第三者の知的財産と類似・重複する可能性があること、生成物が不完全であったりバグを含んでいたりする可能性があることも明記されています。

つまり、「商用利用が認められているから何でも自由に使ってよい」というわけではなく、人によるレビューやリスク低減の工夫を組み合わせたうえで、生成物の知的財産権や利用可否について利用者自身が慎重に判断することが求められると考えられます。実際の案件で利用する場合は、公式ポリシーの最新版を確認したうえで、生成されたコードやデザインを人の目でレビューする工程を組み込むことをおすすめします。特に、既存の他サービスと似たデザインになっていないか、機密情報を含むデータをプロンプトに入力していないかは、業務利用の前に確認しておきたいポイントです。