Html5 Forms

<input type="text" id="autocomplete" autocomplete="on" name="autocomplete" />

<input type="text" autofocus="autofocus" id="autofocus" form="foo" value="This could be annoying" name="autofocus" />

<input type="text" id="disabled" disabled="disabled" name="disabled" value="Disabled" />

<input type="text" id="novalidate" novalidate="novalidate" pattern="[0-9]+" name="novalidate" />

<input type="text" id="pattern" pattern="[0-9]+" name="pattern" />

<input type="text" id="placeholder" placeholder="This is placeholder text" name="placeholder" />

<input type="text" id="readonly" readonly="readonly" name="readonly" value="Readonly" />

<input type="text" id="required" required="required" name="required" />

<input type="color" id="color" name="color" value="#91cf63" />

<input type="file" name="file" id="file" />

<input type="file" id="file_multiple" name="file_multiple" multiple="multiple" />

<input type="hidden" id="hidden_input" name="hidden_input" value="hidden value" />

<input type="image" name="img" id="img" src="/images/Title.png" alt="Tim's Home Page" />

<input type="date" id="date" name="date" value="2020-03-09" />

<input type="time" id="time" name="time" value="00:34" />

<input type="datetime-local" id="datetime-local" name="datetime-local" value="1990-03-09T00:34" />

<input type="month" id="month" name="month" value="2000-01" />

<input type="week" id="week" name="week" value="1985-W23" />

<input type="email" id="email" name="email" value="tim@example.com" />

<input type="number" min="0" max="100" step="5" value="15" id="number" name="number" />

<input type="password" name="password" id="password" value="password" />

<input type="range" min="0" max="100" step="5" value="15" id="range" name="range" />

<input type="search" id="search" name="search" />

<input type="tel" id="tel" name="tel" value="1-234-567-8900" />

<input type="text" id="text" value="text" name="text" />

<input type="url" id="url" name="url" value="https://example.com" />

<input type="checkbox" name="rock" id="genre-rock" checked="checked" />
<label for="genre-rock">Rock</label>

<input type="checkbox" name="disco" id="genre-disco" disabled="disabled" />
<label for="genre-disco">Disco</label>

<input type="checkbox" name="metal" id="genre-metal" />
<label for="genre-metal">Metal</label>

<input type="radio" name="rad" id="radio3" value="Invalid" disabled="disabled" />
<label for="radio3">Maybe</label>

<input type="radio" name="rad" id="radio1" value="Yes" />
<label for="radio1">Yes</label>

<input type="radio" name="rad" id="radio2" value="No" checked="checked" />
<label for="radio2">No</label>

<input type="button" id="input_button" name="button" value="&lt;input type&equals;&quot;button&quot; /&gt;" />

<input type="reset" id="reset" name="reset" />

<input type="submit" id="submit" name="submit" form="html5_form" />

<button type="button" id="button" name="button">type=button</button>

<button type="reset" id="reset_btn" name="reset_btn">type=reset</button>

<button type="submit" id="submit_btn" name="submit_btn">type=submit</button>

<select id="select" name="select">
	<option value="1">Option 1</option>
	<option value="2">Option 2</option>
</select>

<select id="select_opt" name="select_opt">
	<optgroup label="foo">
		<option value="1">Option 1</option>
		<option value="2">Option 2</option>
		<optgroup label="foo.foo">
			<option value="foo1">Foo 1</option>
			<option value="foo2">Foo 2</option>
		</optgroup>
	</optgroup>
	<optgroup label="bar">
		<option value="3">Option 3</option>
		<option value="4">Option 4</option>
	</optgroup>
</select>

<select id="multiple" name="multiple" multiple="multiple">
	<option>Foo</option>
	<option>Bar</option>
	<option>Baz</option>
</select>

<progress value="40" max="100" name="progress"></progress>

<meter value="92" min="0" low="5" high="90" max="100" name="meter"></meter>

<input type="text" id="dlist" list="datalist" name="dlist" />
<datalist id="datalist" name="datalist">
<option value="foo">Foo</option>
<option value="bar">Bar</option>
<option value="baz">Baz</option>
</datalist>

<textarea rows="10" cols="40" id="textarea" name="textarea"></textarea>