<fieldset class="grid gap-3">
<label class="label"><input type="radio" name="radio-group" value="default" class="input">Default</label>
<label class="label"><input type="radio" name="radio-group" value="comfortable" class="input" checked>Comfortable</label>
<label class="label"><input type="radio" name="radio-group" value="compact" class="input">Compact</label>
</fieldset>Usage
Simply add the input class to your <input type="radio"> elements or have a parent with the form class (read more about form). You can also set the aria-invalid attribute to true to make the input invalid.
<fieldset class="grid gap-3">
<label class="label"><input type="radio" name="radio-group" value="default" class="input">Default</label>
<label class="label"><input type="radio" name="radio-group" value="comfortable" class="input" checked>Comfortable</label>
<label class="label"><input type="radio" name="radio-group" value="compact" class="input">Compact</label>
</fieldset>Examples
Form
<form class="form space-y-6 w-full">
<div class="flex flex-col gap-3">
<label for="demo-form-radio">Notify me about...</label>
<fieldset id="demo-form-radio" class="grid gap-3">
<label class="font-normal"><input type="radio" name="demo-form-radio" value="1">All new messages</label>
<label class="font-normal"><input type="radio" name="demo-form-radio" value="2">Direct messages and mentions</label>
<label class="font-normal"><input type="radio" name="demo-form-radio" value="3" >Nothing</label>
</fieldset>
</div>
<button type="submit" class="btn">Submit</button>
</form>