Bootstrap 5 TutorialLesson 6Free preview

BS5 Colors

This lesson is part of Bootstrap · All levels

Summary

Bootstrap provides a class of color utilities such as .text-primary, .text-success, and .bg-danger that can be used for text, background, or components. Its primary colors include primary, secondary, success, danger, warning, info, light, and dark. For special needs, use CSS variable or generic class .text-body-secondary.

Key points

Eight themed colors: primary, secondary, success, danger, warning, info, light, dark.
Prefix .text- for text color and .bg- for background color.
The theme colors are also used by components such as alerts, badges, and buttons.
The CSS variable --bs-* makes custom color adjustment easy.
The dark mode changes the text color contrast automatically.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.