LiOS Colors

Using @import method:

@import url("https://data.colors.liosorg.com/translucent-colors.css");

Using git submodule add:

git submodule add https://github.com/LiOS-org/LiOS-Colors-Data.git

After submodule is added, import it to your main css file

@import url("${path-to-LiOS-Colors-Data}/translucent-colors.css");

Translucent colors works by using CSS variables to define a set of translucent color values that can be applied to elements in your design.

To use these colors, you must have the color in hex format and the color should also exist in LiOS-Colors database(verify by searching the color in the browse section).

Once you have the color in hex format and it exists in the database, you can use it in your CSS using variable names.

You can get the variable name by replacing # of the hex code with --, for example: #4b62d2 becomes --4b62d2.