CSS :active

The CSS :active pseudo-class is used to select and style an element while it is being activated by the user, typically when the user clicks on it. This pseudo-class is often used to provide visual feedback to the user that the element has been clicked or tapped.

When an element is active, the :active pseudo-class is applied to it for the duration of the user's interaction with the element. Once the interaction is completed, the element returns to its normal state.

Here is an example of how to use the :active pseudo-class in CSS:


.input {
  background-color: #2196F3;
  color: white;
  padding: 10px 20px;
}

.input:active {
  background-color: #0d47a1;
}
Result: