diff --git a/examples/custom.tsx b/examples/custom.tsx
new file mode 100644
index 0000000..5fe6ac3
--- /dev/null
+++ b/examples/custom.tsx
@@ -0,0 +1,35 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import { useForm } from '../dist'
+
+const Index: React.FC = () => {
+
+	const { auto, form, errors } = useForm({
+		awesome: true,
+	})
+
+	return (
+		<form onSubmit={e => {
+			e.preventDefault()
+			console.log(form)
+		}}>
+
+			<h1>Custom</h1>
+
+			<label>
+				<input type="checkbox" {...auto('awesome', {
+					setter: 'checked',
+					getter: 'onChange',
+					extractor: (e) => e.target.checked
+				})} />
+				Is it awesome?
+        	</label>
+
+			<input type="submit" />
+
+		</form>
+	)
+}
+
+ReactDOM.render(<Index />, document.getElementById('custom'))
\ No newline at end of file
diff --git a/examples/errorsAndValidation.tsx b/examples/errorsAndValidation.tsx
new file mode 100644
index 0000000..476ebf6
--- /dev/null
+++ b/examples/errorsAndValidation.tsx
@@ -0,0 +1,31 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import { useForm } from '../'
+
+const Index: React.FC = () => {
+
+	const { auto, form, errors } = useForm({
+		username: '',
+		password: ''
+	}, {
+		username: value => value.length > 3,
+		password: /[\d]{1,}/
+	})
+
+	return (
+		<form>
+
+			<h1>Errors & Validation</h1>
+
+			<input {...auto('username')} placeholder="Username" />
+			{errors.username && 'Must be longer than 3'}
+
+			<input {...auto('password')} placeholder="Password" type="password" />
+			{errors.password && 'Must contain a number'}
+
+		</form>
+	)
+}
+
+ReactDOM.render(<Index />, document.getElementById('errors'))
\ No newline at end of file
diff --git a/examples/index.html b/examples/index.html
new file mode 100644
index 0000000..b712881
--- /dev/null
+++ b/examples/index.html
@@ -0,0 +1,67 @@
+<html lang="en">
+
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Form Hero</title>
+	<style>
+		body {
+			padding: 1em;
+			margin: 0;
+			font-family: 'Courier New', Courier, monospace;
+		}
+
+		section {
+			text-align: center;
+			max-width: 25em;
+			margin: 1em auto;
+			padding: 1em;
+			background-color: #f3f3f3;
+			border-radius: .5em;
+			box-shadow: 0 8px 16px -16px rgba(0, 0, 0, .5);
+		}
+
+		input {
+			font-size: 1.25em;
+			display: block;
+			padding: .5em 1em;
+			margin-top: .5em;
+			border-radius: 1em;
+			width: 100%;
+			outline: none;
+			border: .15em solid white;
+		}
+
+		input:focus,
+		input:hover {
+			border-color: #31def5;
+
+		}
+
+		input[type="submit"] {
+			cursor: pointer;
+		}
+
+		input[type="checkbox"] {
+			display: inline;
+			width: initial;
+		}
+	</style>
+</head>
+
+<body>
+	<section>
+		<h3>Open the console to see the submitted data</h3>
+	</section>
+	<section id="simple"></section>
+	<section id="errors"></section>
+	<section id="select"></section>
+	<section id="custom"></section>
+
+	<script src="./simple.tsx"></script>
+	<script src="./errorsAndValidation.tsx"></script>
+	<script src="./select.tsx"></script>
+	<script src="./custom.tsx"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/examples/select.tsx b/examples/select.tsx
new file mode 100644
index 0000000..6a5534b
--- /dev/null
+++ b/examples/select.tsx
@@ -0,0 +1,33 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import { useForm } from '../dist'
+
+const Index: React.FC = () => {
+
+	const { auto, form, errors } = useForm({
+		type: 'formhero',
+	})
+
+	return (
+		<form onSubmit={e => {
+			e.preventDefault()
+			console.log(form)
+		}}>
+
+			<h1>Select</h1>
+
+			<select {...auto('type')}>
+				<option value="redux-form">Redux-Form</option>
+				<option value="react-hook-forms">React-Hook-Forms</option>
+				<option value="formik">Formik</option>
+				<option value="formhero">FormHero</option>
+			</select>
+
+			<input type="submit" />
+
+		</form>
+	)
+}
+
+ReactDOM.render(<Index />, document.getElementById('select'))
\ No newline at end of file
diff --git a/examples/simple.tsx b/examples/simple.tsx
new file mode 100644
index 0000000..f8449d9
--- /dev/null
+++ b/examples/simple.tsx
@@ -0,0 +1,30 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import { useForm } from '../dist'
+
+const Index: React.FC = () => {
+
+	const { auto, form, errors } = useForm({
+		username: 'unicorn',
+		password: '',
+	})
+
+	return (
+		<form onSubmit={e => {
+			e.preventDefault()
+			console.log(form)
+		}}>
+
+			<h1>Simple</h1>
+
+			<input {...auto('username')} placeholder="Username" />
+			<input {...auto('password')} placeholder="Password" type="password" />
+
+			<input type="submit" />
+
+		</form>
+	)
+}
+
+ReactDOM.render(<Index />, document.getElementById('simple'))
\ No newline at end of file
