Use of colors

You may have noticed the use of colors across these tutorials. Some times named colors, like primary, c2, LightBlue, but also HTML/CSS color notation, like #C4AEAD. We'll look into both types, and what they mean.

Named colors

There are two types of names colors, website colors and standard colors.

Named colors	Names	Description
Website colors	primary, secondary, c1, c2, c3, body	These colors are configured website-wide using HTML/CSS color notation. Superusers can give these names the values that will easily accesible when creating stripes.
Standard colors	CrimsonRed, TigerOrange, LightBlue, and many others	These colors are listed in Colors , including an example of the color, the name and the HTML/CSS notation.

Usually you will configure the website colors, to make sure they can be used without remembering their name or notation. But Elephant allows the whole list of standard colors, so you can use an extended palette when needed.

Colors in stripes

If you checked the color list, in Colors , you may have noticed that each color has a different font color, to ensure the font is readable. This mechanism is embedded into the Elephant libraries, and it works for any color you specified.

Stripes allow using a different font color by using innerColor property. You may find an example in Using stripes .

Framework colors

When using framework components, like labels and buttons, you'll be using primary, secondary and a list of fixed colors, shown using labels:

primary secondary red orange yellow olive green teal blue violet purple pink brown grey black

You can differentiate framework colors as they are intended for class properties, for example:

@w{label(class=orange,text=orange)}

orange

Framework colors do also affect icons, like in

..., like in %icon-orange home%

Using configured colors extract content creators from the HTML/CSS boilerplate, and remembering numeric notations.