Radio Input

[Nazarah]

Minimum Requirements

tbd

Input Validations

tbd

[Nazarah]

Radio button: light

1. Normal

radio button border: 1px solid #4729B3
Label: #555555 / (alt.) #4729b3 (if preferred)
transition: border 0.15s

2. Hover

border: 1px solid #7955FF

3. Selected

radio button border: 1px solid #7955FF
radio button background: #FFFFFF
background border: 10px solid #7955FF

4. Disabled

radio button border: 1px solid #C8D8E6
label: #C8D8E6

5. Alert

border: 1px solid #FF6CC0

6. Inline

distance between 2 radio buttons (inc. labels): 20px;

[Nazarah]

Radio button: Dark Background

1. Normal

radio button border: 1px solid #FFFFFF
Label: #FFFFFF
transition: box-shadow 0.15s

2. Hover

border: 2px 2px #ffffff 60%

3. Selected

radio button border: 1px solid #FFFFFF
radio button background: #7955FF
background border: 10px solid #FFFFFF

4. Disabled

background: #8D6EFF
radio button border: 1px solid #B5A1FF
label: #B5A1FF / (alt.) #555555 (if preferred)

5. Alert

border: 1px solid #FF6CC0

6. Inline

distance between 2 radio buttons (inc. labels): 20px;