Для стилизации чекбокса без библиотек можно использовать комбинацию скрытия стандартного элемента и стилизации псевдоэлементов ::before или ::after asociado с родительским <label>.

Скрытие стандартного чекбокса:
```
css
```
Создание стилизуемого "квадрата" с помощью псевдоэлемента <label>:
```
css
```
Стиль для отмеченного состояния:

Используем селектор checked для input и соответственно меняем стили псевдоэлемента label.
```
css
```
Добавление "галочки" (или другого индикатора):

Можно использовать второй псевдоэлемент (::after) или стилизовать существующий ::before с помощью background-image (svg, data-url) или стилизации border.

Пример с border для создания галочки:
```
css
```

Для корректной работы последнего примера, добавьте position: relative; к input[type="checkbox"] + label::before:

css

Этот подход обеспечивает полный контроль над внешним видом чекбокса и хорошую доступность, так как стандартный элемент все еще существует и реагирует на действия пользователя (клик, фокус). Важно связывать input с label с помощью атрибутов id и for для корректной работы при нажатии на текст метки.

html

Как стилизовать чекбоксы с помощью CSS без использования библиотек?