HTMLジェネレーター
AIで単一のHTML要素を生成します。必要なもの（角丸の送信ボタン、必須のメール入力欄など）を説明するだけで、すぐに使えるHTML、CSS、そして圧縮された結合スニペットが手に入ります。
入力
要素にカスタムCSSクラスを追加します。複数のクラスはスペースで区切ってください。
希望するスタイルを指定してください（例：フォントサイズ16px、赤色、黒の2pxボーダー、10%のグレーの影など）。500文字まで。
出力
このツールを使う他の方法
REST API
curl -X POST https://api.iotools.cloud/v1/tool/html-generator \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"customTag": "a rounded submit button",
"customStylesRequirements": "font size 16px, blue background, white text, 8px…"
}'ご自身のアカウントのキーに差し替えてください。ツールのフィールドがそのままリクエストボディになります——ラッパーはありません。
AIエージェントに依頼する
Use the IOTools `html-generator` tool (HTML Generator) on this input:
YOUR_INPUT_HEREIOTools MCPサーバーに接続された任意のエージェントにこれを貼り付け、入力内容を追加してください。
| API/MCP 1回あたりの費用 | 12クレジットから |
|---|---|
| 無料プランのAPI/MCP上限^ | 月180クレジット |
| クレジットが足りませんか? | 料金を見る |
^ 無料プランで、このツールにAPI/MCP経由で月に使える上限額です。クレジットパックを購入すると、Builderと同様にこの上限はなくなります。
次の方法でも利用可能
ガイド
HTML要素を普段の言葉で説明するだけで、すぐに使えるHTML、CSS、圧縮された結合スニペットを受け取れます。マークアップの知識は必要ありません。
このツールは意図的に汎用的に作られています。「角丸の送信ボタン」「フローティングラベル付きの必須メール入力欄」など、何でも説明すると、AIが適切なタグと属性を決定します。必要な要素が正確にわかっている場合は、下にある要素別ジェネレーター（入力フィールド、ボタン、チェックボックス、画像など）をご利用ください。その要素の属性に合わせた専用フォームが用意されており、AIを使わずに即座にHTMLを組み立てます。料金もかかりません。
使い方
- 要素の説明に要素を記述します。具体的であるほど結果が良くなります。「ラベルが「購読する」のチェックボックス（無効化状態）」のように書くと、単に「チェックボックス」と書くよりはるかに良い結果が得られます。
- 必要に応じて、CSSクラスを追加したり、希望するスタイルを記述したりします。
- 生成を押します。
- HTML、CSS、またはミニファイ済みのHTML + CSSの結合版をコピーまたはダウンロードします。
料金について
このツールはクレジットを消費します。生成ボタンには、実行前に正確な料金がリアルタイムで表示されます。クレジットは毎日リセットされ、失敗した実行にはクレジットは一切消費されません。
生成されたマークアップは有効ですか？
AIは標準的なHTMLの慣例（適切なラベル付け、真偽属性、妥当な既定値など）に従うよう指示されていますが、使用する前に必ず出力を確認してください。これは確かな下書きとして扱うべきもので、保証されたものではありません。
入力した内容はどこかに送信されますか？
はい。説明文はマークアップを生成するAIプロバイダーに送信されます。プロンプトの一部として使われるためです。機密情報は含めないでください。
背後にあるAIモデルは何ですか？
その時点でサイトに対応しているモデルです。このツールはプロバイダーに依存せず、バックエンド間で自動的にフェイルオーバーするため、モデルの障害がジェネレーター全体を停止させることはありません。