
<div class="ribbon ribbon-primary ribbon-top-left mt-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-warning ribbon-top-right mt-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-info ribbon-bottom-left mb-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-danger ribbon-bottom-right mb-10"> <div class="ribbon-body">Ribbon</div> </div>
<div class="ribbon ribbon-primary ribbon-clip ribbon-top-left mt-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-warning ribbon-clip ribbon-top-right mt-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-info ribbon-clip ribbon-bottom-left mb-10"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-danger ribbon-clip ribbon-bottom-right mb-10"> <div class="ribbon-body">Ribbon</div> </div>
<div class="ribbon ribbon-primary ribbon-clip ribbon-top-left mt-10"> <div class="ribbon-body"><i class="mdi mdi-pin-outline"></i></div> </div> <div class="ribbon ribbon-warning ribbon-clip ribbon-top-right mt-10"> <div class="ribbon-body"><i class="mdi mdi-pin-outline"></i></div> </div> <div class="ribbon ribbon-info ribbon-clip ribbon-bottom-left mb-10"> <div class="ribbon-body"><i class="mdi mdi-pin-outline"></i></div> </div> <div class="ribbon ribbon-danger ribbon-clip ribbon-bottom-right mb-10"> <div class="ribbon-body"><i class="mdi mdi-pin-outline"></i></div> </div>
<div class="ribbon ribbon-primary ribbon-badge ribbon-top-left"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-warning ribbon-badge ribbon-top-right"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-info ribbon-badge ribbon-bottom-left"> <div class="ribbon-body">Ribbon</div> </div> <div class="ribbon ribbon-danger ribbon-badge ribbon-bottom-right"> <div class="ribbon-body">Ribbon</div> </div>