Form radio button example

With custom heading level

By default, text supplied for the legend is wrapped inside a h2. This can be changed using the heading_level option.

If heading_level is 1 and heading_size is not set, the text size will be xl.

How it looks (preview)

What is your favourite colour?

How to call this example

<%= render "govuk_publishing_components/components/radio", {
  name: "radio-group-description",
  heading: "What is your favourite colour?",
  heading_level: 1,
  items: [
    {
      value: "red",
      text: "Red"
    },
    {
      value: "green",
      text: "Green"
    },
    {
      value: "blue",
      text: "Blue"
    }
  ]
} %>