City of Tampa Style Guide

Color 8.1

Toggle example guides Toggle HTML markup

Change text alignment, transform, style, weight, and color with Bootstraps text utilities and color utilities.

When working with colors be sure to test color contrast combinations.

Notes: Details at Bootstrap Docs

<insert-markup>typography.color-</insert-markup>
.text-primary
.text-secondary must be on dark backgrounds
.text-success
.text-danger
.text-shadow
.text-warning
.text-info
.text-light
.text-muted
.text-white
<div class="text-primary">.text-primary</div>
<div class="text-secondary bg-dark">.text-secondary must be on dark backgrounds</div>
<div class="text-success">.text-success</div>
<div class="text-danger">.text-danger</div>
<div class="text-shadow">.text-shadow</div>
<div class="text-warning">.text-warning</div>
<div class="text-info">.text-info</div>
<div class="text-light bg-dark">.text-light</div>
<div class="text-muted">.text-muted</div>
<div class="text-white bg-dark">.text-white</div>
Source: src/scss/base/_typography.scss, line 173