4.colors & background

• text colors

<p class="text-primary">Text Primary Color</p>
<p class="text-secondary">Text Secondary Color</p>
<p class="text-success">Text Success Color</p>
<p class="text-info">Text Info Color</p>
<p class="text-warning">Text Warning Color</p>
<p class="text-danger">Text Danger Color</p>
<p class="text-light">Text Light Color</p>
<p class="text-dark">Text Dark Color</p>
<p class="text-white">Text White Color</p>
<p class="text-muted">Text Muted</p>
<p class="text-black-50">Text Black 50</p>
<p class="text-white-50">Text White 50</p>

• link colors

<p>
    <a class="text-primary" href="#">Primary link</a>
</p>
<p>
    <a class="text-secondary" href="#">Secondary link</a>
</p>
<p>
    <a class="text-success" href="#">Success link</a>
</p>
<p>
    <a class="text-info" href="#">Info link</a>
</p>
<p>
    <a class="text-warning" href="#">Warning link</a>
</p>
<p>
    <a class="text-danger" href="#">Danger link</a>
</p>
<p>
    <a class="text-light" href="#">Light link</a>
</p>
<p>
    <a class="text-dark" href="#">Dark link</a>
</p>
<p>
    <a class="text-muted" href="#">Muted link</a>
</p>
<p>
    <a class="text-white" href="#">White link</a>
</p>

• background colors

<div class="bg-primary">Background Primary Color</div>
<div class="bg-secondary">Background Secondary Color</div>
<div class="bg-success">Background Success Color</div>
<div class="bg-info">Background Info Color</div>
<div class="bg-warning">Background Warning Color</div>
<div class="bg-danger">Background Danger Color</div>
<div class="bg-light">Background Light Color</div>
<div class="bg-dark">Background Dark Color</div>
<div class="bg-white">Background White Color</div>
<div class="bg-transparent">Background Transparent</div>

• invisible

<p class="invisible">Hello</p>