JSFiddle - React, Tailwind, and code Playground

by Amin Pourhadi

HTML

<label>f:</label><input type="text" 
pattern="(1[012]|[1-9]):[0-5][0-9](\\s)?(?i)(am|pm)"/>

CSS

input:invalid {box-shadow: none; color:red;}
input:valid   {color:blue}