Colors
Color palette for your project.
To align with the Bitrix24 style, you should use only the colors from this palette. Other colors are not recommended.
Palette
Gray
100
#EDEEF0
50
#EEF2F4
40
#F1F4F6
30
#F5F7F8
20
#F8FAFB
white
#FFFFFF
150
#E6E7E9
200
#DFE0E3
300
#D5D7DB
350
#C9CCD0
default
400
#BDC1C6
500
#A8ADB4
600
#959CA4
700
#828B95
800
#6A737F
900
#525C69
black
#333333
solid
#000000
Red
100
#FFF8F8
150
#FFF0F0
200
#FFE8E8
250
#FFDCDB
300
#FFCDCC
400
#FF9A97
450
#FF7C78
default
500
#FF5752
600
#F4433E
700
#E92F2A
solid
#F0371B
800
#C21B16
900
#9A0703
950
#800602
Orange
100
#FFFAF0
beige
#FDFAE1
150
#FFF5E3
200
#FFF1D6
250
#FFE9BE
300
#FFE1A6
400
#FFC34D
default
500
#FFA900
600
#E89B06
700
#C48300
800
#9F6A00
900
#7A5100
950
#614000
Green
100
#FAFDED
150
#F5FCDE
200
#F1FBD0
250
#FAF6C3
300
#E2F1B3
350
#CFE780
400
#BBDE4D
default
500
#9DCF00
550
#95C500
600
#8DBB00
700
#7FA800
800
#688800
900
#506900
950
#3D4F00
Blue
100
#F4FCFE
150
#ECFAFE
200
#E5F9FF
250
#D3F4FF
300
#C3F0FF
400
#7FDEFC
default
500
#2FC6F6
600
#11A9D9
700
#008DBA
800
#00789E
900
#006484
950
#004f69
Base
base-20
#F8FAFB
base-30
#F5F7F8
base-40
#F1F4F6
base-50
#EEF2F4
base-100
#EDEEF0
base-150
#E6E7E9
base-200
#DFE0E3
base-300
#D5D7DB
base-350
#C9CCD0
base-400
#BDC1C6
base-500
#A8ADB4
base-600
#959CA4
base-700
#828B95
base-800
#6A737F
base-900
#525C69
base-master
#333333
base-solid
#000000
Primary
primary-on
#FFFFFF
primary-text
#333333
primary-background
#FFFFFF
primary-background-on
#333333
primary-link
#2066B0
Secondary
secondary-on
#FFFFFF
secondary-text
#525C69
secondary-background
#EDEEF0
secondary-background-on
#6A737F
secondary-link
#004f69
Alert
alert-on
#FFFFFF
default
alert-text
#FF5752
alert-background
#FFE8E8
alert-background-on
#E92F2A
alert-link
#9A0703
Success
success-on
#FFFFFF
default
success-text
#9DCF00
success-background
#F1FBD0
success-background-on
#7FA800
success-link
#506900
Warning
warning-on
#FFFFFF
default
warning-text
#FFA900
warning-background
#FFF1D6
warning-background-on
#C48300
warning-link
#7A5100
Info
info-on
#FFFFFF
default
info-text
#2FC6F6
info-background
#E5F9FF
info-background-on
#008DBA
info-link
#006484
Tag
tag-1
#BCEDFC
tag-2
#00BAF2
tag-3
#DBF087
tag-4
#87EDA0
tag-5
#C2D1F0
tag-6
#ACE5EC
tag-7
#DFC684
tag-8
#CCD3DD
tag-9
#E2E3E5
Accent
accent-light-blue
#559BE6
accent-aqua
#55D0E0
accent-pink
#FB6DBA
accent-brown
#AE914B
accent-green
#29AD49
accent-turquoise
#05B5AB
accent-purple
#A77BDE
accent-lavender
#8E52EC
accent-yellow
#FEF3B8
Copilot
copilot-primary
#8E52EC
copilot-secondary
#B095DC
copilot-dark
#682AC6
Symlink
symlink-note
#FDFAE1
symlink-subtle
#828B95
symlink-extranet
#E89B06
symlink-tertiary
#EEF2F4