Opacity

Utility classes for changing an element's opacity.

Classes

Change an element's opacity by using a .d-opacity{#} class. The table below lists the available classes and its CSS output.

Class Output
.d-opacity0 opacity: 0;
.d-opacity5 opacity: 0.05;
.d-opacity10 opacity: 0.1;
.d-opacity20 opacity: 0.2;
.d-opacity25 opacity: 0.25;
.d-opacity30 opacity: 0.3;
.d-opacity40 opacity: 0.4;
.d-opacity50 opacity: 0.5;
.d-opacity60 opacity: 0.6;
.d-opacity70 opacity: 0.7;
.d-opacity75 opacity: 0.75;
.d-opacity80 opacity: 0.8;
.d-opacity90 opacity: 0.9;
.d-opacity95 opacity: 0.95;
.d-opacity100 opacity: 1;

Examples

.d-opacity0
.d-opacity5
.d-opacity10
.d-opacity20
.d-opacity25
.d-opacity30
.d-opacity40
.d-opacity50
.d-opacity60
.d-opacity70
.d-opacity75
.d-opacity80
.d-opacity90
.d-opacity95
.d-opacity100