CSS :default Pseudo Class - Playground Example

<!DOCTYPE html><html><head><style type="text/css">/* Target the default radio/checkbox and its label */
input:default {
  outline: 3px solid #4CAF50;
  outline-offset: 2px;
}

/* Adding a 'Default' text label using a sibling selector */
input:default + span::after {
  content: " (Recommended)";
  font-style: italic;
  font-size: 0.8rem;
  color: #4CAF50;
}

/* General styling for layout */
label {
  display: block;
  margin: 10px 0;
  font-family: sans-serif;
}</style></head><body><form>
  <h3>Choose your subscription:</h3>
  <label>
    <input type="radio" name="plan" value="basic"> Basic
  </label>
  <label>
    <input type="radio" name="plan" value="pro" checked> Pro (Default)
  </label>
  <label>
    <input type="radio" name="plan" value="premium"> Premium
  </label>

  <h3>Add-ons:</h3>
  <label>
    <input type="checkbox" name="terms" checked> Accept Terms (Required)
  </label>
</form></body></html>