diff --git a/src/Css/Application.css b/src/Css/Application.css
index f4afcce0..cb70cee6 100644
--- a/src/Css/Application.css
+++ b/src/Css/Application.css
@@ -109,17 +109,13 @@ textarea::placeholder {
   opacity: 1;
 }
 
-input:invalid,
-textarea:invalid {
+input:user-invalid,
+textarea:user-invalid {
+  @apply border-base08;
   box-shadow: none;
   outline: none;
 }
 
-input[changed]:invalid,
-textarea[changed]:invalid {
-  @apply border-base08;
-}
-
 select:-moz-focusring {
   color: transparent;
   text-shadow: 0 0 0 rgb(63, 63, 63);
diff --git a/src/Javascript/UI/misc.ts b/src/Javascript/UI/misc.ts
index e96c9e04..6da919e6 100644
--- a/src/Javascript/UI/misc.ts
+++ b/src/Javascript/UI/misc.ts
@@ -38,41 +38,6 @@ window.addEventListener("blur", event => {
 
 
 
-// Forms
-// -----
-// Adds a `changed` attribute to form fields, if the form was "changed".
-// This is to help with styling, we don't want to show an error immediately.
-
-const FIELD_SELECTOR = "input, textarea"
-
-
-document.addEventListener("keyup", e => {
-  const field = e.target && (<HTMLElement>e.target).closest(FIELD_SELECTOR)
-  if (field) field.setAttribute("changed", "")
-})
-
-
-document.addEventListener("click", e => {
-  if (!e.target || (<HTMLElement>e.target).tagName !== "BUTTON") return;
-  const form = (<HTMLElement>e.target).closest("form")
-  if (form) markAllFormFieldsAsChanged(form)
-})
-
-
-document.addEventListener("submit", e => {
-  const form = e.target && (<HTMLElement>e.target).closest("form")
-  if (form) markAllFormFieldsAsChanged(form)
-})
-
-
-function markAllFormFieldsAsChanged(form) {
-  [].slice.call(form.querySelectorAll(FIELD_SELECTOR)).forEach(field => {
-    field.setAttribute("changed", "")
-  })
-}
-
-
-
 // Internet Connection
 // -------------------