export default function Example() {
  return (
    <>
      <RadioGroup
        legend="Primary"
        name="primary"
        isOutline
        defaultValue={"opt1"}
        css={{ marginRight: "$050" }}
        variant="primary"
      >
        <RadioButton label="Option 1" value="opt1" id="opt1" />
        <RadioButton label="Option 2" value="opt2" id="opt2" />
        <RadioButton label="Option 3" value="opt3" id="opt3" />
      </RadioGroup>
      <RadioGroup
        legend="Secondary"
        name="secondary"
        isOutline={"true"}
        defaultValue={"opt1"}
        css={{ marginRight: "$050" }}
        variant="secondary"
      >
        <RadioButton label="Option 1" value="opt1" id="opt4" />
        <RadioButton label="Option 2" value="opt2" id="opt5" />
        <RadioButton label="Option 3" value="opt3" id="opt6" />
      </RadioGroup>
      <RadioGroup
        legend="CTA"
        name="cta"
        isOutline={"true"}
        defaultValue={"opt1"}
        variant="cta"
      >
        <RadioButton label="Option 1" value="opt1" id="opt7" />
        <RadioButton label="Option 2" value="opt2" id="opt8" />
        <RadioButton label="Option 3" value="opt3" id="opt9" />
      </RadioGroup>
    </>
  );
}

To enter the code editing mode, press Enter. To exit the edit mode, press Escape

You are editing the code. To exit the edit mode, press Escape