---
layout: default
permalink: /colors
category: utilities
title: Color palette
description: "Our color palette consists of neutral, white and blue.
These colors are used as variants in all classes of eFrolic,
that is, as a second class after the main one to personalize elements.
Colors convey meaning and add a bit of emotional weight to the elements."
---
{{ page.description }}
After a main class, example: e-btn apply the desired color in lowercase letters.
Required: A main class of eFrolic.
Warning: Some components are not compatible with all colors.
{% highlight html %} Color
Primary / #1da1f2
Success / #4fd69c
Danger / #f75676
Warning / #ffdd57
Sky / #54c7ec
Purple / #5e72e4
Blue-gradient
Inst-gradient
purple-gradient
Green-gradient
Transparent
Default
Gray
White
Dark
Black
Add text- after the color to use.
Warning: Not all colors are available for text.
{% highlight html %} Color...
text-white
text-gray
text-dark
text-black
text-primary
text-success
text-danger
text-warning
text-sky
text-purple
{% highlight html %}text-white
text-gray
text-dark
text-black
text-primary
text-success
text-danger
text-warning
text-sky
text-purple
{% endhighlight %}
{% highlight html %} {% endhighlight %}