Opacity tokens
Opacity
| Ex. | Token name | Value | Use case | |
|---|---|---|---|---|
Click to copy
--rh-opacity-0 |
Click to copy
0% |
0% opacity |
var(--rh-opacity-0, 0%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-0
|
|
Click to copy
--rh-opacity-10 |
Click to copy
10% |
10% opacity |
var(--rh-opacity-10, 10%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-10
|
|
Click to copy
--rh-opacity-20 |
Click to copy
20% |
20% opacity |
var(--rh-opacity-20, 20%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-20
|
|
Click to copy
--rh-opacity-30 |
Click to copy
30% |
30% opacity |
var(--rh-opacity-30, 30%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-30
|
|
Click to copy
--rh-opacity-40 |
Click to copy
40% |
40% opacity |
var(--rh-opacity-40, 40%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-40
|
|
Click to copy
--rh-opacity-50 |
Click to copy
50% |
50% opacity |
var(--rh-opacity-50, 50%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-50
|
|
Click to copy
--rh-opacity-60 |
Click to copy
60% |
60% opacity |
var(--rh-opacity-60, 60%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-60
|
|
Click to copy
--rh-opacity-70 |
Click to copy
70% |
70% opacity |
var(--rh-opacity-70, 70%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-70
|
|
Click to copy
--rh-opacity-80 |
Click to copy
80% |
80% opacity |
var(--rh-opacity-80, 80%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-80
|
|
Click to copy
--rh-opacity-90 |
Click to copy
90% |
90% opacity |
var(--rh-opacity-90, 90%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-90
|
|
Click to copy
--rh-opacity-100 |
Click to copy
100% |
100% opacity |
var(--rh-opacity-100, 100%)
https://ux.redhat.com/tokens/opacity/#rh-opacity-100
|
Other libraries
To learn more about our other libraries, visit this page.
Feedback
To give feedback about anything on this page, contact us.
Other libraries
To learn more about our other libraries, visit this page.
