React UI
Edit page
Home
Getting Started
Customize
Foundation
Components: UI
Components: Layouts
CSS Helpers
Animation Box Alignment Colors Display Spacing Typography
Readme

# Colors

The color helpers allow coloring any text with the built-in
brand and UI colors. On top of that, there is a muted variant for low-priority text.

`.text-primary`
`.text-secondary`
`.text-success`
`.text-warning`
`.text-error`
`.text-help`
`.text-info`
`.text-note`
`.text-muted`
<Placeholder bordered> <code className="text-primary">.text-primary</code> </Placeholder> <Placeholder bordered> <code className="text-secondary">.text-secondary</code> </Placeholder> <Placeholder bordered> <code className="text-success">.text-success</code> </Placeholder> <Placeholder bordered> <code className="text-warning">.text-warning</code> </Placeholder> <Placeholder bordered> <code className="text-error">.text-error</code> </Placeholder> <Placeholder bordered> <code className="text-help">.text-help</code> </Placeholder> <Placeholder bordered> <code className="text-info">.text-info</code> </Placeholder> <Placeholder bordered> <code className="text-note">.text-note</code> </Placeholder> <Placeholder bordered> <code className="text-muted">.text-muted</code> </Placeholder>

    <Placeholder bordered>  <code className="text-primary">.text-primary</code></Placeholder><Placeholder bordered>  <code className="text-secondary">.text-secondary</code></Placeholder><Placeholder bordered>  <code className="text-success">.text-success</code></Placeholder><Placeholder bordered>  <code className="text-warning">.text-warning</code></Placeholder><Placeholder bordered>  <code className="text-error">.text-error</code></Placeholder><Placeholder bordered>  <code className="text-help">.text-help</code></Placeholder><Placeholder bordered>  <code className="text-info">.text-info</code></Placeholder><Placeholder bordered>  <code className="text-note">.text-note</code></Placeholder><Placeholder bordered>  <code className="text-muted">.text-muted</code></Placeholder>

Next: Display →