Ionic Colors

Ionic Colors : Ionic provides ready color utility which you can use frequently in you application. Ionic provides recommended naming convention for colors. It’s easy and simple to use ionic colors utility rather than adding the colors in css. You can also override the default colors. Here we are going to explain the color utility with example and demo.

Ionic Colors

Here is list of colors available in ionic Colors-

Text Colors Class

If you want to change the text color add the below css-

• .dark
• .stable-dark
• .positive
• .calm
• .balanced
• .energized
• .assertive
• .royal
• .dark

Background Colors Class

If you want to change the background color add the below css-

• .dark-bg
• .stable-dark-bg
• .positive-bg
• .calm-bg
• .balanced-bg
• .energized-bg
• .assertive-bg
• .royal-bg
• .dark-bg

Here an example of both text and background color

If you run the above example it will produce the following output-