Radio

Displays a radio input styled like a terminal UI radio

<label>
  <input type="radio" name="choice" />
  Option
</label>

Import

@import "@webtui/css/components/radio.css";

Usage

<label>
    <input type="radio" name="choice" />
    Option
</label>

Examples

Checked/Unchecked

<label>
  <input type="radio" name="r" /> 
  Unchecked 
</label>
<label>
  <input type="radio" name="r" checked /> 
  Checked 
</label>

Disabled

<label>
  <input type="radio" name="r2" disabled />
  Disabled
</label>
<label>
  <input type="radio" name="r2" checked disabled /> 
  Checked Disabled
</label>

Reference

Extending

To extend the Radio stylesheet, define a CSS rule on the components layer:

@layer components {
  input[type="radio"] {
    /* ... */
  }
}

Scope

• All native <input type="radio"> elements

input[type="radio"] {
  /* ... */
}