VOOZH about

URL: https://www.geeksforgeeks.org/css/spectre-text-colors/

⇱ Spectre Text Colors - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

Spectre Text Colors

Last Updated : 23 Jul, 2025

Spectre colors are one of the most useful utilities, there are two types of things where we can use colors. Like we can set colors for the text and we can set colors for the background.

In this article, we will learn about the text color, along with understanding, how we can set the colors of the text in Spectre by using these classes.

Spectre Text Colors Class:

  • text-error: This class is used to set the text with a red color.
  • text-warning: This class is used to set the text with a yellow color.
  • text-success: This class is used to set the text with a green color.
  • text-light: This class is used to set the text with white color.
  • text-gray: This class is used to set the text with a gray color.
  • text-dark: This class is used to set the text with black color.
  • text-secondary: This class is used to set the text with a light gray color.
  • text-primary: This class is used to set the text with a blue color.

Syntax:

<element class = "text-colorName"> Content </element>

Below example illustrates the Spectre Text Colors.

Example:

Output:

👁 Spectre Text Colors
Spectre Text Colors

Reference: https://picturepan2.github.io/spectre/utilities/colors.html#colors-text

Comment