JSFiddle - React, Tailwind, and code Playground

HTML

<fieldset>
    <label>Number</label>
    <input type="number" value="1" max="10" min="1" step="1" required>
</fieldset>

CSS

input{
    border:1px solid red;
}
input:invalid {
    border: 1px solid purple;
}