<h1>Regex on input value</h1>

<input id=demo>

<p>This input will go red when the regular expression <code>/magic/gi</code> is met. So it should light up for any values that contain 'MAGIC' or 'magic'</p>

<style process="load input">
  ${/magic/gi.test(demo.value) && '#demo'} {
    background: red;
  }
</style>

<footer>Built with <a href=https://tomhodgins.github.io/reprocss/>reproCSS</a> </footer>
input {
  padding: .25em;
  width: 100%;
  font-size: 14pt;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //rawgit.com/tomhodgins/reprocss/master/reprocss.js