The title is ambiguous actually, why do we want to use an invalid pseudo-class? 🤔 And is it not valid pseudo-class in CSS plenty? Why? Because. Hi. In form context, we can use :invalid and :valid pseudo-class to notify user if their input is either invalid or valid. The CSS styling for the pseudo-class can be applied to: input tag (with exception) ✅ ❌ Input type exception: button , submit , reset , image , hidden , file , range , color , checkbox , radio . It is because there is no validation is done to those particular types. textarea tag ✅ select tag ✅ Let's try it combined with massive JavaScript and plenty of HTML elements. 🤣 No, it's quite straightforward actually. We can see the example below. Demonstration Please enable JavaScript Please choose Option One Option two Option three Option four ...