HTML Code

<!DOCTYPE html>
<html>
<head>
  <title>CSS input[type=checkbox] Example</title>
  <style>
    input[type="checkbox"] {
      width: 1.1rem;
      height: 1.1rem;
      accent-color: #7c3aed;
      cursor: pointer;
    }

    label {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-bottom: 0.65rem;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>Preferences</h1>
  <label>
    <input type="checkbox" checked>
    Subscribe to newsletter
  </label>
  <label>
    <input type="checkbox">
    Accept terms and conditions
  </label>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

CSS [attribute=value] - Checkbox Inputs