Логотип Berry CSSBerry CSS 3.0

Таблица цветов Berry CSS

Здесь приведены цвета Berry CSS. Для оценки степени контраста тексты выводятся в белом и черном варианте.

Используется градация от 50 до 950. Классы формируются из названия цвета + степень градации. Например: t-red600, bg-red600. Цвета Material Design указаны на отдельной странице

Степень «500» это тоже самое, что и «чистый» цвет. Например t-red500 это тоже самое, что и t-red. В Sass такие переменные также равны: например $red равна $red500.

Для правильного отображения цветов откалибруйте яркость монитора так, чтобы видеть оттенки 50 и 950.

50
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
100
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
150
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
200
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
250
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
300
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
350
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
400
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
450
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
500
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
550
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
600
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
650
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
700
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
750
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
800
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
850
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
900
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink
950
gray
gray
red
red
brown
brown
orange
orange
yellow
yellow
lime
lime
green
green
teal
teal
cyan
cyan
blue
blue
indigo
indigo
violet
violet
purple
purple
pink
pink

gray
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
red
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
brown
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
orange
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
yellow
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
lime
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
green
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
teal
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
cyan
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
blue
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
indigo
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
violet
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
purple
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950
pink
50
50
100
100
150
150
200
200
250
250
300
300
350
350
400
400
450
450
500
500
550
550
600
600
650
650
700
700
750
750
800
800
850
850
900
900
950
950

gray
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
red
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
brown
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
orange
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
yellow
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
lime
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
green
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
teal
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
cyan
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
blue
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
indigo
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
violet
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
purple
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
pink
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950

gray
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
red
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
brown
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
orange
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
yellow
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
lime
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
green
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
teal
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
cyan
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
blue
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
indigo
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
violet
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
purple
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
pink
50
100
150
200
250
300
350
400
450
500
550
600
650
700
750
800
850
900
950
bg-white / t-black
bg-black / t-white
t-color1
t-color2
t-color3
t-color4
t-color5
t-color6
t-color7
t-color1
t-color2
t-color3
t-color4
t-color5
t-color6
t-color7
bg-color1
bg-color1
bg-color2
bg-color2
bg-color3
bg-color3
bg-color4
bg-color4
bg-color5
bg-color5
bg-color6
bg-color6
bg-color7
bg-color7

Бордюры

bor-black
bor-white
bor-gray100
bor-gray200
bor-gray300
bor-gray400
bor-gray(500)
bor-gray600
bor-gray700
bor-gray800
bor-gray900
bor-color1
bor-color2
bor-color3
bor-color4
bor-color5
bor-color6
bor-color7
bor-red
bor-brown
bor-orange
bor-yellow
bor-lime
bor-green
bor-teal
bor-cyan
bor-blue
bor-indigo
bor-violet
bor-purple
bor-pink