Opacity
Apply opacity properties of an element
Classes
Class | Properties |
---|---|
.opacity-0 | opacity: 0; |
.opacity-{1-9} | opacity: {.1-.9}; |
.opacity-10 | opacity: 1; |
.opacity-[0-10]
Sets the opacity property to a value between 0 and 1.
xxxxxxxxxx
1
<div class="opacity-0 p-4 bg-black"></div>
2
<div class="opacity-1 p-4 bg-black"></div>
3
<div class="opacity-2 p-4 bg-black"></div>
4
<div class="opacity-3 p-4 bg-black"></div>
5
<div class="opacity-4 p-4 bg-black"></div>
6
<div class="opacity-5 p-4 bg-black"></div>
7
<div class="opacity-6 p-4 bg-black"></div>
8
<div class="opacity-7 p-4 bg-black"></div>
9
<div class="opacity-8 p-4 bg-black"></div>
10
<div class="opacity-9 p-4 bg-black"></div>
11
<div class="opacity-10 p-4 bg-black"></div>
Responsive
<div class="opacity-10 bp1:opacity-3 bp2:opacity-7 bp3:opacity-0 bp4:opacity-5 ...">
<!-- ... -->
</div>