Velký vzorník barev
Barvy používané v prostředí aplikace (UI – User Interface) a na webu.
RGB
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Všechny formáty
.zip
Red
#FE1A3F
Black
#000000
White
#FFFFFF
Light Gray
#F5F5F5
Red
rgb(254, 26, 63)
Black
rgb(0, 0, 0)
White
rgb(255, 255, 255)
Light Gray
rgb(245, 245, 245)
Red
N/A
Black
N/A
White
N/A
Light Gray
N/A
Red
N/A
Black
N/A
White
N/A
Light Gray
N/A
Red
N/A
Black
N/A
White
178 U
Light Gray
N/A
Red
N/A
Black
N/A
White
N/A
Light Gray
N/A
Red
S 5578
Black
N/A
White
D 4532
Light Gray
N/A
Red
N/A
Black
N/A
White
N/A
Light Gray
N/A
Malý vzorník barev
Barvy používané v prostředí aplikace (UI – User Interface) a na webu.
RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Všechny formáty
.zip
Black
#000000
Dark Maroonssefe
#380016
Burgundy
#540020
Cranberry
#7F0030
Raspberry
#A9003F
Rose Red
#D3004F
Bright Red
#FD005F
Error
#FE1B3F
Black
rgb(0, 0, 0)
Dark Maroonssefe
rgb(56, 0, 22)
Burgundy
rgb(84, 0, 32)
Cranberry
rgb(127, 0, 48)
Raspberry
rgb(169, 0, 63)
Rose Red
rgb(211, 0, 79)
Bright Red
rgb(253, 0, 95)
Error
rgb(254, 27, 63)
Black
0-0-0-100
Dark Maroonssefe
0-100-60-84
Burgundy
0-100-60-70
Cranberry
0-100-60-55
Raspberry
0-100-60-35
Rose Red
0-100-60-17
Bright Red
0-100-63-1
Error
0-89-75-0
Black
Black C
Dark Maroonssefe
504 C
Burgundy
7645 C
Cranberry
7421 C
Raspberry
7635 C
Rose Red
1925 C
Bright Red
1787 C
Error
1788 C
Black
Black U
Dark Maroonssefe
504 U
Burgundy
7645 U
Cranberry
7421 U
Raspberry
7635 U
Rose Red
1925 U
Bright Red
1787 U
Error
1788 U
Black
RAL 9005
Dark Maroonssefe
RAL 3007
Burgundy
RAL 3005
Cranberry
RAL 4004
Raspberry
RAL 4006
Rose Red
RAL 4010
Bright Red
RAL 3026
Error
RAL 3027
Black
N/A
Dark Maroonssefe
N/A
Burgundy
N/A
Cranberry
N/A
Raspberry
N/A
Rose Red
N/A
Bright Red
N/A
Error
N/A
Black
N/A
Dark Maroonssefe
N/A
Burgundy
N/A
Cranberry
N/A
Raspberry
N/A
Rose Red
N/A
Bright Red
N/A
Error
N/A
Kompaktní paleta barev
Barevné palety nám umožňují vytvářet digitální prostředí (aplikace, web) s ohledem na dostatečný kontrast a přístupnost všech prvků.
RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Všechny formáty
.zip
Blue 100
#071338
Blue 90
#071D67
Blue 80
#0A2E9B
Blue 70
#1043CD
Blue 60
#2460FF
Blue 50
#4B8AFF
Blue 40
#7CA8FF
Blue 30
#A9C7FF
Blue 20
#D0E0FF
Blue 10
#ECF5FF
Gray 100
#161616
Gray 90
#262626
Gray 80
#393939
Gray 70
#525252
Gray 60
#6F6F6F
Gray 50
#8D8D8D
Gray 40
#A8A8A8
Gray 30
#C6C6C6
Gray 20
#E0E0E0
Gray 10
#F4F4F4
Red 100
#2B0B0B
Red 90
#4F090D
Red 80
#740E14
Red 70
#A2171F
Red 60
#D9222C
Red 50
#F95355
Red 40
#FF8384
Red 30
#FFB3B2
Red 20
#FFD6D5
Red 10
#FFF1F2
Blue 100
rgb(7, 19, 56)
Blue 90
rgb(7, 29, 103)
Blue 80
rgb(10, 46, 155)
Blue 70
rgb(16, 67, 205)
Blue 60
rgb(36, 96, 255)
Blue 50
rgb(75, 138, 255)
Blue 40
rgb(124, 168, 255)
Blue 30
rgb(169, 199, 255)
Blue 20
rgb(208, 224, 255)
Blue 10
rgb(236, 245, 255)
Gray 100
rgb(22, 22, 22)
Gray 90
rgb(38, 38, 38)
Gray 80
rgb(57, 57, 57)
Gray 70
rgb(82, 82, 82)
Gray 60
rgb(111, 111, 111)
Gray 50
rgb(141, 141, 141)
Gray 40
rgb(168, 168, 168)
Gray 30
rgb(198, 198, 198)
Gray 20
rgb(224, 224, 224)
Gray 10
rgb(244, 244, 244)
Red 100
rgb(43, 11, 11)
Red 90
rgb(79, 9, 13)
Red 80
rgb(116, 14, 20)
Red 70
rgb(162, 23, 31)
Red 60
rgb(217, 34, 44)
Red 50
rgb(249, 83, 85)
Red 40
rgb(255, 131, 132)
Red 30
rgb(255, 179, 178)
Red 20
rgb(255, 214, 213)
Red 10
rgb(255, 241, 242)
Blue 100
87-66-0-78
Blue 90
93-72-0-60
Blue 80
94-70-0-39
Blue 70
92-67-0-20
Blue 60
86-62-0-0
Blue 50
71-46-0-0
Blue 40
51-34-0-0
Blue 30
34-22-0-0
Blue 20
18-12-0-0
Blue 10
7-4-0-0
Gray 100
0-0-0-91
Gray 90
0-0-0-85
Gray 80
0-0-0-77
Gray 70
0-0-0-68
Gray 60
0-0-0-56
Gray 50
0-0-0-45
Gray 40
0-0-0-34
Gray 30
0-0-0-23
Gray 20
0-0-0-12
Gray 10
0-0-0-4
Red 100
0-74-74-83
Red 90
0-89-84-69
Red 80
0-88-83-55
Red 70
0-86-81-36
Red 60
0-84-80-15
Red 50
0-67-66-2
Red 40
0-49-48-0
Red 30
0-30-30-0
Red 20
0-16-16-0
Red 10
0-5-5-0
Blue 100
2965 C
Blue 90
2757 C
Blue 80
293 C
Blue 70
2728 C
Blue 60
2727 C
Blue 50
279 C
Blue 40
2718 C
Blue 30
2708 C
Blue 20
656 C
Blue 10
649 C
Gray 100
Black 6 C
Gray 90
Cool Gray 11 C
Gray 80
Cool Gray 10 C
Gray 70
Cool Gray 9 C
Gray 60
Cool Gray 8 C
Gray 50
Cool Gray 7 C
Gray 40
Cool Gray 6 C
Gray 30
Cool Gray 4 C
Gray 20
Cool Gray 2 C
Gray 10
Cool Gray 1 C
Red 100
4975 C
Red 90
490 C
Red 80
491 C
Red 70
492 C
Red 60
485 C
Red 50
7417 C
Red 40
709 C
Red 30
707 C
Red 20
705 C
Red 10
663 C
Blue 100
2965 U
Blue 90
2757 U
Blue 80
293 U
Blue 70
2728 U
Blue 60
2727 U
Blue 50
279 U
Blue 40
2718 U
Blue 30
2708 U
Blue 20
656 U
Blue 10
649 U
Gray 100
Black 6 U
Gray 90
Cool Gray 11 U
Gray 80
Cool Gray 10 U
Gray 70
Cool Gray 9 U
Gray 60
Cool Gray 8 U
Gray 50
Cool Gray 7 U
Gray 40
Cool Gray 6 U
Gray 30
Cool Gray 4 U
Gray 20
Cool Gray 2 U
Gray 10
Cool Gray 1 U
Red 100
4975 U
Red 90
490 U
Red 80
491 U
Red 70
492 U
Red 60
485 U
Red 50
7417 U
Red 40
709 U
Red 30
707 U
Red 20
705 U
Red 10
663 U
Blue 100
5004
Blue 90
5002
Blue 80
5010
Blue 70
5015
Blue 60
5012
Blue 50
5015
Blue 40
5024
Blue 30
5015
Blue 20
9003
Blue 10
9016
Gray 100
9011
Gray 90
7021
Gray 80
7022
Gray 70
7031
Gray 60
7042
Gray 50
7045
Gray 40
7035
Gray 30
7047
Gray 20
9018
Gray 10
9003
Red 100
3007
Red 90
3009
Red 80
3011
Red 70
3003
Red 60
3020
Red 50
3027
Red 40
3015
Red 30
3015
Red 20
3015
Red 10
9016
Blue 100
S7020-R80B
Blue 90
S6030-R80B
Blue 80
S4050-R80B
Blue 70
S3060-R80B
Blue 60
S2060-R80B
Blue 50
S1555-R80B
Blue 40
S1040-R80B
Blue 30
S0520-R80B
Blue 20
S0510-R80B
Blue 10
S0505-R80B
Gray 100
S9000-N
Gray 90
S8000-N
Gray 80
S7500-N
Gray 70
S6500-N
Gray 60
S5500-N
Gray 50
S4500-N
Gray 40
S3500-N
Gray 30
S2500-N
Gray 20
S1500-N
Gray 10
S0500-N
Red 100
S8005-Y80R
Red 90
S7020-Y90R
Red 80
S6030-Y90R
Red 70
S5040-Y90R
Red 60
S3060-Y90R
Red 50
S2070-Y90R
Red 40
S1040-Y90R
Red 30
S0530-Y90R
Red 20
S0510-Y90R
Red 10
S0505-Y90R
Široká paleta barev
Barevné palety nám umožňují vytvářet digitální prostředí (aplikace, web) s ohledem na dostatečný kontrast a přístupnost všech prvků.
RGB
.ase
CMYK
.ase
Figma - Design Tokens
.json
CSS Variables
.css
SCSS Variables
.scss
Tailwind Config
.js
PDF export
.pdf
Všechny formáty
.zip
Blue 100
#071338
Blue 90
#071D67
Blue 80
#0A2E9B
Blue 70
#1043CD
Blue 60
#2460FF
Blue 50
#4B8AFF
Blue 40
#7CA8FF
Blue 30
#A9C7FF
Blue 20
#D0E0FF
Blue 10
#ECF5FF
Red 100
#2B0B0B
Red 90
#4F090D
Red 80
#740E14
Red 70
#A2171F
Red 60
#D9222C
Red 50
#F95355
Red 40
#FF8384
Red 30
#FFB3B2
Red 20
#FFD6D5
Red 10
#FFF1F2
Blue 100
rgb(7, 19, 56)
Blue 90
rgb(7, 29, 103)
Blue 80
rgb(10, 46, 155)
Blue 70
rgb(16, 67, 205)
Blue 60
rgb(36, 96, 255)
Blue 50
rgb(75, 138, 255)
Blue 40
rgb(124, 168, 255)
Blue 30
rgb(169, 199, 255)
Blue 20
rgb(208, 224, 255)
Blue 10
rgb(236, 245, 255)
Red 100
rgb(43, 11, 11)
Red 90
rgb(79, 9, 13)
Red 80
rgb(116, 14, 20)
Red 70
rgb(162, 23, 31)
Red 60
rgb(217, 34, 44)
Red 50
rgb(249, 83, 85)
Red 40
rgb(255, 131, 132)
Red 30
rgb(255, 179, 178)
Red 20
rgb(255, 214, 213)
Red 10
rgb(255, 241, 242)
Blue 100
87-66-0-78
Blue 90
93-72-0-60
Blue 80
94-70-0-39
Blue 70
92-67-0-20
Blue 60
86-62-0-0
Blue 50
71-46-0-0
Blue 40
51-34-0-0
Blue 30
34-22-0-0
Blue 20
18-12-0-0
Blue 10
7-4-0-0
Red 100
0-74-74-83
Red 90
0-89-84-69
Red 80
0-88-83-55
Red 70
0-86-81-36
Red 60
0-84-80-15
Red 50
0-67-66-2
Red 40
0-49-48-0
Red 30
0-30-30-0
Red 20
0-16-16-0
Red 10
0-5-5-0
Blue 100
2965 C
Blue 90
2757 C
Blue 80
293 C
Blue 70
2728 C
Blue 60
2727 C
Blue 50
279 C
Blue 40
2718 C
Blue 30
2708 C
Blue 20
656 C
Blue 10
649 C
Red 100
4975 C
Red 90
490 C
Red 80
491 C
Red 70
492 C
Red 60
485 C
Red 50
7417 C
Red 40
709 C
Red 30
707 C
Red 20
705 C
Red 10
663 C
Blue 100
2965 U
Blue 90
2757 U
Blue 80
293 U
Blue 70
2728 U
Blue 60
2727 U
Blue 50
279 U
Blue 40
2718 U
Blue 30
2708 U
Blue 20
656 U
Blue 10
649 U
Red 100
4975 U
Red 90
490 U
Red 80
491 U
Red 70
492 U
Red 60
485 U
Red 50
7417 U
Red 40
709 U
Red 30
707 U
Red 20
705 U
Red 10
663 U
Blue 100
5004
Blue 90
5002
Blue 80
5010
Blue 70
5015
Blue 60
5012
Blue 50
5015
Blue 40
5024
Blue 30
5015
Blue 20
9003
Blue 10
9016
Red 100
3007
Red 90
3009
Red 80
3011
Red 70
3003
Red 60
3020
Red 50
3027
Red 40
3015
Red 30
3015
Red 20
3015
Red 10
9016
Blue 100
S7020-R80B
Blue 90
S6030-R80B
Blue 80
S4050-R80B
Blue 70
S3060-R80B
Blue 60
S2060-R80B
Blue 50
S1555-R80B
Blue 40
S1040-R80B
Blue 30
S0520-R80B
Blue 20
S0510-R80B
Blue 10
S0505-R80B
Red 100
S8005-Y80R
Red 90
S7020-Y90R
Red 80
S6030-Y90R
Red 70
S5040-Y90R
Red 60
S3060-Y90R
Red 50
S2070-Y90R
Red 40
S1040-Y90R
Red 30
S0530-Y90R
Red 20
S0510-Y90R
Red 10
S0505-Y90R
Vzorník gradientů
Příklady gradientů používaných v rámci značky. Nově lze definovat gradienty se třemi barvami.
Visualbook Red
#FE1B3F
Info 20
#C7E3FF
CTA
#0F62FE
Info 20
#C7E3FF
Visualbook Red
#FE1B3F
CTA
#0F62FE
Black
#000000
Gray 100
#141619
Gray 70
#4F525F
CTA
#0F62FE
Poměry barev
Proporcionální použití barev v rámci vizuálního stylu. Sekce je v novém, vylepšeném designu.
Kontrola kontrastu
Zkontrolujte kontrast mezi barvami popředí a pozadí pro zajištění čitelnosti textů, nadpisů a tlačítek podle standardů přístupnosti.
Výsledný kontrast
21.00
Malý text
Méně než 18pt nebo 14pt tučné
AAA
Velký text
Alespoň 18pt nebo 14pt tučné
AAA
UI komponenty
Grafické objekty a UI komponenty
AA
Prozkoumat tuto barevnou kombinaci na color.review nebo coolors.co
Barevné režimy
Barevné režimy (HEX, RGB, CMYK, Pantone, RAL, NCS, 3M) představují různé systémy definování barev, které se používají v různých médiích a technologiích. Tabulka níže vysvětluje jejich použití pro správné zobrazení loga na obrazovkách, v tisku či fyzických materiálech.
| Barevný režim | Co je to? | Použití |
|---|---|---|
| HEX | Ekvivalent RGB (hexadecimální) | WEBHTMLCSS |
| RGB | Barevný prostor obrazovek RGB | WEBHTMLCSS |
| CMYK |
Barevný prostor pro tiskárny CMYK |
TISK |
| Pantone |
Přímé namíchané barvy Pantone pro tisk | TISK |
| RAL |
Systém přiřazování barev RAL pro fyzické objekty | PRŮMYSL |
| NCS |
Systém přirozených barev NCS založený na vnímání | PRŮMYSLDESIGN |
| 3M |
Systém vinylových fólií 3M pro polepy a signmaking | SIGNMAKING |