<div class="input-grp"> <label>Username</label> <input class="input" type="text" placeholder="Username"> </div> <div class="input-grp"> <label>Email address</label> <input class="input input-error" type="email" placeholder="Email address"> <div class="error-msg">Please enter correct email.</div> </div> <div class="input-grp"> <label>Password</label> <input class="input input-warning" type="password" placeholder="Password"> <div class="warning-msg">Please enter a strong password.</div> </div> <div class="input-grp"> <label>Confirm Password</label> <input class="input input-success" type="password" placeholder="Password"> <div class="success-msg">Password matched.</div> </div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter