Colors

Background colors

Axentix colors are made to automatically match with the best text-color between black and white to help you getting your site the best accessibility possible. So when you choose a background color, the text will automatically be black or white, but you can change it an any time with our text-colors classes, or with your own CSS code.

Text colors

Changing the text color is as easy as the background color, you just have to precise the color with the prefix .text-.

Border colors

Changing the border color is really easy, you just have to specify the color with the prefix .bd-.
Use the different border classes to create a custom border on the borders page.

Dark and Light

Every color in our palette can be lighten and darken. You can light a color up to 4 times using classes .light-1 to .light-4. To make a color darker, use the .dark-1 to .dark-5 to make your color darken.
You can light and dark a text too, you just have to precise .text-dark-X or .text-light-X X as the number from 1 to 4 to light, and 1 to 5 to dark your color.

Color palette

We created a color palette to let you choose between some predefiened colors to change your text and your background colors. To use them, simply use their name into the classes as explained before.

Colors css variables

Every color of the Axentix palette generates a css variable.
This is allowing you to overload a color at any time.