# Radio

### Usage

* Used to select a single state from multiple options.
* The difference from Select is that Radio is visible to the user and can facilitate the comparison of choice, which means there shouldn't be too many of them.

### States

![](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FHpfFB10jlGSpGCyWqMi0%2FRadio%201.png?alt=media\&token=94df107a-427a-4cd5-bffd-a0290d39d450)

### Specs

#### 1. Basic

![](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FpBo7U12kUN3mb18uhkjf%2FRadio%202.png?alt=media\&token=ba40fb35-75f3-4fb8-9795-74c38f704706)

#### 2. Radio button

We provide 3 sizes of radio button: large, default and small:

* Large

![](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FeDM4sM896PvQeWNRPasu%2FRadio%203.png?alt=media\&token=ff572b67-7265-413f-af1f-86e43bfa35b6)

* Default

![](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FwrlEsNCQ5AiF1AOxvv0d%2FRadio%204.png?alt=media\&token=4f99a7da-41c4-4608-8fa9-352ab845df07)

* Small

![](https://3606779243-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDSuDatsiBSDcGYiS7br6%2Fuploads%2FjWUBR9DMUfNR3phqsgT0%2FRadio%205.png?alt=media\&token=ed1d32ba-374f-4a12-868f-ba52e4780f7a)

### Sample code

```
// Some code
```