# valid pseudo-class

The `valid` pseudo-class sets the style for inputs in which a valid value or a value corresponding to the specified type was entered.

## Syntax

`selector:valid { }`

## Example

Let's recolor an input background to pink when an invalid value is entered and back to green when the value passes the check for the selected type:

`<p>Enter Your email</p> <p><input type="email"></p>` `input:invalid { background: #E37D76; } input:valid { background: #9DDFA4; }`

:

## See also

- the `:invalid` pseudo-class
  that sets a style for the input into which an invalid value was entered
- the `:out-of-range` pseudo-class
  that styles elements whose values ​​are out of range
- the `:in-range` pseudo-class
  that sets a style to elements with a given range of values

← →
↑
en ru