Colors – Sanvio

Colors

Střední vzorník barev

Colours used in the application environment (UI – User Interface) and on the web.

RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Visualbook Export
.txt
All formats
.zip
Purple
#636698
Purple Ultra Light
#F3F1F6
Blue
#003946
Purple
rgb(99, 102, 152)
Purple Ultra Light
rgb(243, 241, 246)
Blue
rgb(0, 57, 70)
Purple
55-50-0-25
Purple Ultra Light
3-3-1-0
Blue
100-60-50-50
Purple
N/A
Purple Ultra Light
N/A
Blue
N/A
Purple
N/A
Purple Ultra Light
N/A
Blue
N/A
Purple
N/A
Purple Ultra Light
N/A
Blue
N/A
Purple
N/A
Purple Ultra Light
N/A
Blue
N/A

Dplňkové barvy

Colours used in the application environment (UI – User Interface) and on the web.

RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Visualbook Export
.txt
All formats
.zip
White
#FFFFFF
Black
#000000
Red Orange
#EE4136
Yellow
#FFDF5E
White
rgb(255, 255, 255)
Black
rgb(0, 0, 0)
Red Orange
rgb(238, 65, 54)
Yellow
rgb(255, 223, 94)
White
0-0-0-0
Black
100-70-50-100
Red Orange
0-84-78-0
Yellow
0-15-75-0
White
N/A
Black
N/A
Red Orange
N/A
Yellow
N/A
White
N/A
Black
N/A
Red Orange
N/A
Yellow
N/A
White
N/A
Black
N/A
Red Orange
N/A
Yellow
N/A
White
N/A
Black
N/A
Red Orange
N/A
Yellow
N/A

Wide range of colours

Colour palettes allow us to create digital environments (apps, web) with sufficient contrast and accessibility of all elements.

Note

sseg

RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Visualbook Export
.txt
All formats
.zip

Purple

#636698

Purple 90

#6f70a0

Purple 80

#7a7ca8

Purple 70

#8788b1

Purple 60

#9495bb

Purple 50

#a2a3c4

Purple 40

#b1b2ce

Purple 30

#c1c2d9

Purple 20

#d2d2e4

Purple 10

#e5e5ef

Purple Ultra Light

#f3f1f6

Purple

rgb(99, 102, 152)

Purple 90

rgb(111, 112, 160)

Purple 80

rgb(122, 124, 168)

Purple 70

rgb(135, 136, 177)

Purple 60

rgb(148, 149, 187)

Purple 50

rgb(162, 163, 196)

Purple 40

rgb(177, 178, 206)

Purple 30

rgb(193, 194, 217)

Purple 20

rgb(210, 210, 228)

Purple 10

rgb(229, 229, 239)

Purple Ultra Light

rgb(243, 241, 246)

Purple

55-50-0-25

Purple 90

50-45-0-23

Purple 80

44-40-0-20

Purple 70

39-35-0-18

Purple 60

33-30-0-15

Purple 50

28-25-0-13

Purple 40

22-20-0-10

Purple 30

17-15-0-8

Purple 20

11-10-0-5

Purple 10

6-5-0-3

Purple Ultra Light

3-3-1-0

Colour ratios

Proportional use of colour within the visual style. The section is in a new, improved design.

Color modes

Color modes (HEX, RGB, CMYK, Pantone, RAL, NCS) represent different color definition systems used in various media and technologies. The table below explains their usage for proper logo display on screens, in print, or physical materials.

Color Mode
What is it?
Usage
HEX RGB Equivalent (hexadecimal) WEBHTMLCSS
RGB Color Space of Screens RGB WEBHTMLCSS
CMYK
 Color Space for Printers CMYK
 PRINT
Pantone
 Direct Mixed Colors Pantone for printing  PRINT
RAL
 Color matching system RAL for physical objects  INDUSTRIAL
NCS
 Natural Color System NCS based on human perception  INDUSTRIALDESIGN