HTML Button Generator
Generate a <button> element — set the button text, type, and click behavior, then copy the ready-to-use HTML. Free, instant, no AI involved.
Input
Use lowercase, descriptive names with underscores or dashes for readability (e.g., submit_button or my-button).
Settings
Sent to the server as this button's value when the form is submitted.
Add custom CSS classes to the element. Separate multiple classes with spaces.
Output
More ways to use this tool
REST API
curl -X POST https://api.iotools.cloud/v1/tool/html-generator/button \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"customName": "my-button",
"customLabel": "Submit",
"customDisabled": "",
"customAutofocus": "",
"customType": "button",
"customValue": "",
"customButtonOnClick": "",
"customClasses": ""
}'Swap in your own key from your account. The tool's fields are the body — no wrapper.
Ask an AI agent
Use the IOTools `html-generator__button` tool (HTML Button Generator) on this input:
YOUR_INPUT_HEREPaste this at any agent connected to the IOTools MCP server, then add your input.
Embed widget
<iframe
src="https://iotools.cloud/embed/html-generator/button/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="HTML Button Generator — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>Drop this into your own page — free, no key required, just a link back.
| Cost per API/MCP call | From 5 credits |
|---|---|
| Need more credits? | View pricing |
Also available with
Guides
Build a ready-to-paste <button> element — set the text, type (button/submit/reset), and an optional click handler, then copy the generated HTML.
Runs entirely in your browser: no AI call, no credits, no network round-trip. The output updates instantly as you type.
How to use it
- Set the Name and Button Text.
- Pick a Button Type and, if needed, an
onclickhandler. - Copy or download the generated HTML.
Why is there no live preview?
The output is real, unsanitized markup — rendering it directly on the page isn't safe. Paste the code into your own page to see it in context.