Opacity

o-0
o-10
o-20
o-30
o-40
o-50
o-60
o-70
o-80
o-90
o-100
hover me
  <div class="d-flex d-flex-wrap gap-4">
    <div class="box box-info o-0">o-0</div>
    <div class="box box-info o-10">o-10</div>
    <div class="box box-info o-20">o-20</div>
    <div class="box box-info o-30">o-30</div>
    <div class="box box-info o-40">o-40</div>
    <div class="box box-info o-50">o-50</div>
    <div class="box box-info o-60">o-60</div>
    <div class="box box-info o-70">o-70</div>
    <div class="box box-info o-80">o-80</div>
    <div class="box box-info o-90">o-90</div>
    <div class="box box-info o-100">o-100</div>
  </div>
  <div class="box box-info hover:o-50 mt-2">hover me</div>
o-0...100Opacity from 0% to 100% with step 10%.
hover:o-0...100Opacity on hover.