splitforms.com
Get free key
HTML · FORM CONTROL

HTML Input — every input type with a live working form

The <input> element is the most used form control in HTML. Its type= attribute switches its behaviour — text, email, tel, number, date, file, checkbox, radio, and more. Each type gives you free browser validation and the right mobile keyboard. Below is a form using the most common input types that actually submits.

Updated June 2026 · The <input> element · 12 elements in the reference

Get free access key Try the live demo
preview · html inputsandboxed · no key
§ 01Copy-paste codeworking · submits to a free backend
input.html
<form action="https://splitforms.com/api/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">

  <label for="name">Full name</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Email</label>
  <input type="email" id="email" name="email" placeholder="you@example.com" required>

  <label for="phone">Phone</label>
  <input type="tel" id="phone" name="phone" placeholder="+1 555 000 0000">

  <label for="qty">Quantity</label>
  <input type="number" id="qty" name="quantity" min="1" value="1">

  <label for="when">Preferred date</label>
  <input type="date" id="when" name="preferred_date">

  <input type="checkbox" name="botcheck" style="display:none">
  <button type="submit">Send</button>
</form>

Replace YOUR_ACCESS_KEY with a key from your free splitforms dashboard. The form posts to one endpoint — submissions land in your inbox and dashboard with spam filtering built in.

§ 02<input> attributes
AttributeWhat it does
typeSets the control: text, email, tel, number, date, file, checkbox, radio, password, hidden, submit, and more.
nameThe key the value is submitted under. Without it, the field is not sent at all.
valueThe initial value. For text fields it's the default text; for checkbox/radio it's what gets sent when checked.
placeholderA short hint shown when the field is empty. It is not a substitute for a <label>.
requiredBoolean. The browser blocks submit and shows a hint if the field is empty.
min / max / stepConstraints for number and date inputs. The browser validates against them.
patternA regex the value must match. Pair it with a title= explaining the required format.
autocompleteHints like "email", "tel", "given-name" that let browsers autofill correctly.
§ 03Common mistakes
⚠ gotcha

No name = no data

An input without name= is dropped from the submission. id only wires up <label for> and anchors.

⚠ gotcha

type=email only checks format

It validates the shape (a@b.co) but not whether the address is real or deliverable. Validate deliverability server-side.

⚠ gotcha

placeholder is not a label

Placeholders vanish on focus and hurt accessibility. Always include a real <label> linked with for=.

§ 04Questions
What is the HTML input tag?
The <input> element is an HTML form control that lets users enter data. The type= attribute determines what kind of control it is — text, email, number, date, file, checkbox, radio, and others — each with built-in validation and an appropriate mobile keyboard.
What are the HTML input types?
Common types include text, email, password, tel, number, date, time, file, checkbox, radio, range, color, url, search, hidden, and submit. Each type changes how the field behaves, validates, and renders on mobile.
What is the use of the input tag?
The input tag collects a single value from the user — a name, an email, a number, a chosen file — and submits it under its name= attribute when the form is posted to the server or backend.
How do I allow file uploads in HTML?
Use <input type="file" name="resume">, add enctype="multipart/form-data" to the <form>, and post to a backend that accepts files (splitforms supports uploads on Starter and above with storage connected).
Why is my input value not submitting?
Almost always because the input is missing a name= attribute, the field is disabled, or it sits outside the <form>. Check that name= is set and the control is inside the form element.

Make this form actually submit.

Point your form at splitforms. 500 free submissions/month, spam filtering, webhooks — no server.

Get free access key →All HTML elements