py_ets

Radio Group

Forms

About

An accessible radio button group for selecting one option from a set, styled with Tailwind CSS on top of React Aria Components.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Radio Group to your project and fits it to your theme.

Code

How Radio Group is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { RadioGroup, Radio } from "@/components/ui/tailwind-radiogroup";

export default function RadioGroupDemo() {
  return (
    <RadioGroup
      label="Favorite pet"
      defaultValue="cats"
      description="Choose the pet you like the most."
    >
      <Radio value="dogs">Dogs</Radio>
      <Radio value="cats">Cats</Radio>
      <Radio value="dragons">Dragons</Radio>
    </RadioGroup>
  );
}

Dependencies

More by py_ets

View all
  • Alert Dialog

    Alert Dialog

    12
  • React Aria CheckboxGroup

    React Aria CheckboxGroup

    9
  • Command Palette

    Command Palette

    7
  • React Aria DatePicker

    React Aria DatePicker

    6
  • Progress Bar

    Progress Bar

    6
  • React Aria Tree

    React Aria Tree

    4
  • React Aria Switch

    React Aria Switch

    4
  • React Aria ColorArea

    React Aria ColorArea

    4

More in Forms

View all
  • Premium Auth

    Premium Auth

    524
  • Contact Card

    Contact Card

    1K
  • Book A Demo 1

    Book A Demo 1

    73
  • Form

    Form

    16
  • Login 1

    Login 1

    53
  • Book A Demo 3

    Book A Demo 3

    89
  • Hand-Drawn Checkbox

    Hand-Drawn Checkbox

    48
  • Login Card

    Login Card

    6