Notus Angular Colors

We have used Tailwind CSS colors utility classes to apply colors to the background of elements, text, and borders. Includes support for styling links with hover states, too.


Here are all the colors from Tailwind. Replace the * from each of the below example with what are you interested in:

  • Background Colors: bg
  • Border Colors: border
  • Divide Colors: divide
  • Placeholder Colors: placeholder
  • Text Colors: text

Also, besides the bellow colors, you also have transparent, current, black, and white.

Gray

Color Color name Color class
Gray 100 *-gray-100
Gray 200 *-gray-200
Gray 300 *-gray-300
Gray 400 *-gray-400
Gray 500 *-gray-500
Gray 600 *-gray-600
Gray 700 *-gray-700
Gray 800 *-gray-800
Gray 900 *-gray-900

Red

Color Color name Color class
Red 100 *-red-100
Red 200 *-red-200
Red 300 *-red-300
Red 400 *-red-400
Red 500 *-red-500
Red 600 *-red-600
Red 700 *-red-700
Red 800 *-red-800
Red 900 *-red-900

Orange

Color Color name Color class
Orange 100 *-orange-100
Orange 200 *-orange-200
Orange 300 *-orange-300
Orange 400 *-orange-400
Orange 500 *-orange-500
Orange 600 *-orange-600
Orange 700 *-orange-700
Orange 800 *-orange-800
Orange 900 *-orange-900

Yellow

Color Color name Color class
Yellow 100 *-yellow-100
Yellow 200 *-yellow-200
Yellow 300 *-yellow-300
Yellow 400 *-yellow-400
Yellow 500 *-yellow-500
Yellow 600 *-yellow-600
Yellow 700 *-yellow-700
Yellow 800 *-yellow-800
Yellow 900 *-yellow-900

Green

Color Color name Color class
Green 100 *-green-100
Green 200 *-green-200
Green 300 *-green-300
Green 400 *-green-400
Green 500 *-green-500
Green 600 *-green-600
Green 700 *-green-700
Green 800 *-green-800
Green 900 *-green-900

Teal

Color Color name Color class
Teal 100 *-teal-100
Teal 200 *-teal-200
Teal 300 *-teal-300
Teal 400 *-teal-400
Teal 500 *-teal-500
Teal 600 *-teal-600
Teal 700 *-teal-700
Teal 800 *-teal-800
Teal 900 *-teal-900

Blue

Color Color name Color class
Blue 100 *-blue-100
Blue 200 *-blue-200
Blue 300 *-blue-300
Blue 400 *-blue-400
Blue 500 *-blue-500
Blue 600 *-blue-600
Blue 700 *-blue-700
Blue 800 *-blue-800
Blue 900 *-blue-900

Indigo

Color Color name Color class
Indigo 100 *-indigo-100
Indigo 200 *-indigo-200
Indigo 300 *-indigo-300
Indigo 400 *-indigo-400
Indigo 500 *-indigo-500
Indigo 600 *-indigo-600
Indigo 700 *-indigo-700
Indigo 800 *-indigo-800
Indigo 900 *-indigo-900

Purple

Color Color name Color class
Purple 100 *-purple-100
Purple 200 *-purple-200
Purple 300 *-purple-300
Purple 400 *-purple-400
Purple 500 *-purple-500
Purple 600 *-purple-600
Purple 700 *-purple-700
Purple 800 *-purple-800
Purple 900 *-purple-900

Pink

Color Color name Color class
Pink 100 *-pink-100
Pink 200 *-pink-200
Pink 300 *-pink-300
Pink 400 *-pink-400
Pink 500 *-pink-500
Pink 600 *-pink-600
Pink 700 *-pink-700
Pink 800 *-pink-800
Pink 900 *-pink-900