⌘ K
esc

    Opacity

    Sets the opacity of an element.

    Classes
    Class Properties
    opacity-0 opacity: 0;
    opacity-10 opacity: .1;
    opacity-20 opacity: .2;
    opacity-30 opacity: .3;
    opacity-40 opacity: .4;
    opacity-50 opacity: .5;
    opacity-60 opacity: .6;
    opacity-70 opacity: .7;
    opacity-80 opacity: .8;
    opacity-90 opacity: .9;
    opacity-100 opacity: 1;
    Examples
    opacity-10
    opacity-40
    opacity-70
    opacity-100
    
    <div class="card">
        <div class="flex align-items-center justify-content-center card-container blue-container">
            <div class="opacity-10 flex align-items-center justify-content-center border-round bg-blue-500 text-white p-3 m-3 font-bold">opacity-10</div>
            <div class="opacity-40 flex align-items-center justify-content-center border-round bg-blue-500 text-white p-3 m-3 font-bold">opacity-40</div>
            <div class="opacity-70 flex align-items-center justify-content-center border-round bg-blue-500 text-white p-3 m-3 font-bold">opacity-70</div>
            <div class="opacity-100 flex align-items-center justify-content-center border-round bg-blue-500 text-white p-3 m-3 font-bold">opacity-100</div>
        </div>
    </div>