Buttons on the light theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |
Buttons on the middle shade of the light theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |
Buttons on the darkest shade of the light theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |
Buttons on the dark theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |
Buttons on the middle tint of the dark theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |
Buttons on the lightest tint of the dark theme
| Type | default | :hover | :focus | :active | :active:focus | disabled |
|---|
Primary | | | | | | |
Secondary | | | | | | |
Positive | | | | | | |
Negative | | | | | | |
Brand | | | | | | |
Link | | | | | | |
Tertiary | | | | | | |
Icon (secondary) | | | | | | |
Icon only (secondary) | | | | | | |
Icon (tertiary) | | | | | | |