You are currently viewing the documentation for Vuetify 3

Go to Vuetify 2

Radio buttons

The v-radio component is a simple radio button. When combined with the v-radio-group component you can provide groupable functionality to allow users to select from a predefined set of options.

Usage

Although v-radio can be used on its own, it is best used in conjunction with v-radio-group. Using the v-model on the v-radio-group you can access the value of the selected radio button inside the group.

API

Component	Description
v-radio-group	Primary Component
v-radio	Sub-component used for modifying the `v-radio-group` state

Examples

Props

Colors

Radios can be colored by using any of the builtin colors and contextual names using the color prop.

Direction

Radio-groups can be presented either as a row or a column, using their respective props. The default is as a column.

Slots

Label

Radio Group labels can be defined in label slot - that will allow to use HTML content.

Ready for more?

Continue your learning with related content selected by the Team or move between pages by using the navigation links below.

Edit this page onGitHub