Cacher is the code snippet organizer for pro developers

<input type="text" required />
<form novalidate></form> //disable validation
<input type="email" > //no validation
<input type="email" required> //required+email validation

input:invalid{ //invalid pseudoelement set by browser
  color:#c33;
  border-color:#c33;
}

input:focus:invalid{
  box-shadow: 0px 0px 5px red;
}

//No javascript interactivity

input:valid + .invalid { /* Adjacent sibling selector */
  visibility: hidden;
}

input:invalid + .invalid {
  visibility: visible;
}

input:required {
  border-bottom: 2px solid #c33;
}

input:valid {
  border-bottom: transparent;
}