Opacity
Utilities for controlling the opacity of an element.
Class | Property |
---|---|
opacity-0 | opacity: 0 |
opacity-25 | opacity: 0.25 |
opacity-50 | opacity: 0.50 |
opacity-75 | opacity: 0.75 |
opacity-100 | opacity: 1 |
Example
Customizing
By default BinStorm provides five opacity utilities based on a simple numeric scale. You change, add, or remove these by editing the opacity section of your BinStorm config.
{
// ...
opacity: {
'0': 0,
- '25': .25,
- '50': .5,
- '75': .75,
+ '10': .1,
+ '20': .2,
+ '30': .3,
+ '40': .4,
+ '50': .5,
+ '60': .6,
+ '70': .7,
+ '80': .8,
+ '90': .9,
'100': 1,
}
}
Disabling
If you don't plan to use the opacity-{value}
utilities in your project, you can disable them entirely by removing the opacity
property in the modules
section of your config file:
{
// ...
modules: {
// ...
- opacity: {
- prefix: 'opacity',
- propertyName: 'opacity',
- }
}
}