Edit on
<form action="">
  <input type="text" required>
  <span>is </span>
</form>
input + span {
  color: #999;
}

input:focus {  
  &:valid + span:after {
    content: 'valid';
    color: #0c0;
  }

  &:invalid + span:after {
    content: 'invalid';
    color: #c00;
  }
}
View Compiled
Rerun