Components

Radio

Native radio, the same accent-color treatment as Checkbox.

Basic

Radio

Weekly Monthly

Markup

<label>
  <input type="radio" name="demo-radio-1" checked="" />
  Weekly
</label>
<label>
  <input type="radio" name="demo-radio-1" />
  Monthly
</label>

As a group

Interval

Repeat Every week Every month Every year

Markup

<fieldset>
  <legend>Repeat</legend>
  <label>
    <input type="radio" name="demo-radio-2" checked="" />
    Every week
  </label>
  <label>
    <input type="radio" name="demo-radio-2" />
    Every month
  </label>
  <label>
    <input type="radio" name="demo-radio-2" />
    Every year
  </label>
</fieldset>

API

Element / attribute	Values	Notes
`input[type="radio"]`		Required base — no class. Tinted with `accent-color`.
`checked`	boolean
`name`	string	Groups mutually exclusive radios.
`label`	text content	Wrap the input directly — `label:has(> input[type="radio"])` is what applies the row layout.