AI

スクリーンショットからコード

スクリーンショット、モックアップ、デザインをAIできれいなHTML/CSS、Tailwind、Reactコードに変換。ライブプレビューですぐ確認。

スクリーンショットからコードは現在準備中で、まもなく利用できるようになります。それまではHEXカラーピッカーでデザインの色を取得してみてください。

ヒント:Ctrl+V(Macは⌘V)でスクリーンショットを貼り付けられます。最大5MB。

    出力コード

    スクリーンショットからコードについて

    スクリーンショットからコードは、Webサイト、アプリ、デザインモックアップのスクリーンショットをAIが解析し、それを再現するコードを書きます。HTMLとCSS、Tailwind CSSを使ったHTML、Reactコンポーネントから選び、コードをコピーしたりライブプレビューで確認したりできます。

    スクリーンショットからコードの使い方

    1. Webページやデザインのスクリーンショットをアップロードまたは貼り付けます。
    2. HTML + CSS、Tailwind、Reactから選びます。
    3. 「コードを生成」をクリックし、コードをコピーするかライブプレビューを確認します。

    よくある質問

    コードの精度は?

    レイアウト、色、フォント、テキストをかなり忠実に再現します。複雑なページは少し手直しが必要な場合があり、画像はプレースホルダーに置き換えられます。

    コードを商用利用できますか?

    はい。生成されたコードはどのプロジェクトでも自由に使えます。

    スクリーンショットは保存されますか?

    いいえ。コード生成のためにAIプロバイダーへ送信されますが、当サイトのサーバーには保存されません。