Utilities

Align

    <div class="box-row left">Left float</div>
    <div class="box-row right">Right float</div>

Margin - Padding

    <div class="box-sample ">
        <div class="box-row margin-xl">XL Margin</div>
    </div>

    <div class="box-sample ">
        <div class="box-row padding-xl">XL Margin</div>
    </div>

Text colors

    <p class="text-error"></p>
    <p class="text-warning"></p>
    <p class="text-success"></p>
    <p class="text-info"></p>
    <p class="text-primary"></p>

Text alignments

    <p class="text-left"></p>
    <p class="text-center"></p>
    <p class="text-right"></p>

Badge

    <span class="badge">2</span>
    <span class="badge badge-error">10</span>
    <span class="badge badge-info">3</span>
    <span class="badge badge-warning">55</span>
    <span class="badge badge-success">11</span>