Basics

Basic colors

This is basic colors table:

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

The given numbers correspond to the colors. You can use this colors for text as well as for backgrounds. For set color for text use its number with c prefix in class name, for background use color number with bc prefix.

<div class="c1 bc0">white text on black background</div>

Interaction elements color collection

Interaction elements is buttons and snackbars. They can take following colors:

default
positive
negative
violet
black
orange

Examples: button, snackbar.

CSS abbreviations

Following abbreviations could be used as CSS-classes for any element.

Abbreviation CSS-value
.fl float: left;
.fr float: right;
.ib display: inline-block;
.c text-align: center;
.r text-align: right;
.l text-align: left;
.dn display: none;
.clear-fix clear: both;
Abbreviation CSS-value
.m* margin-bottom: *px;
.mt* margin-top: *px;
.ml* margin-left: *px;
.mr* margin-right: *px;
where * is 0, 5, 10, 15, 18, 20, 30, 40, 50 or 60