Checkbox color darkens on hover

Viewed 67

I have changed the color of my checkboxes when they are checked to not be the default light blue using the following CSS:

input[type="checkbox"] {
  accent-color: var(--red);
}

I tried using the :hover pseudo-selector however it still darkens it.

:root {
  --red: #ee5d5a;
}

input[type="checkbox"] {
  accent-color: var(--red);
  margin-right: 10px;
}

input[type="checkbox"]:hover {
  accent-color: var(--red);
}
<input id="two" type="checkbox" checked>General

0 Answers
Related