Backup ONE official

Backup ONE color scheme. www.backup.ch

💖 276 likes

Created Apr 4, 2018

10 colors

Color Palette Overview

0abbef

1A1A1A

F9FAFC

78828B

00244A

45af70

000000

145784

009fe3

545c62

Colors and Tints/Shades

10% Lighter	5% Lighter	Original Color	5% Darker	10% Darker
#36caf7 Tint -10%	#1ec3f6 Tint -5%	0abbef Original	#09a7d7 Shade +5%	#0894bf Shade +10%
#333333 Tint -10%	#262626 Tint -5%	1A1A1A Original	#0d0d0d Shade +5%	#000000 Shade +10%
#ffffff Tint -10%	#ffffff Tint -5%	F9FAFC Original	#e7ebf3 Shade +5%	#d6ddea Shade +10%
#949ca4 Tint -10%	#868f98 Tint -5%	78828B Original	#6c767f Shade +5%	#606971 Shade +10%
#003e80 Tint -10%	#003166 Tint -5%	00244A Original	#001933 Shade +5%	#000c1a Shade +10%
#66c28b Tint -10%	#54bb7d Tint -5%	45af70 Original	#3f9d64 Shade +5%	#378b59 Shade +10%
#1a1a1a Tint -10%	#0d0d0d Tint -5%	000000 Original	#000000 Shade +5%	#000000 Shade +10%
#1b75b1 Tint -10%	#17669b Tint -5%	145784 Original	#11496f Shade +5%	#0d3b59 Shade +10%
#1abaff Tint -10%	#00b3ff Tint -5%	009fe3 Original	#008fcc Shade +5%	#007db3 Shade +10%
#6c777f Tint -10%	#606a71 Tint -5%	545c62 Original	#495055 Shade +5%	#3d4348 Shade +10%

Complete Color Information

Professional color data with RGB and CMYK values for all design applications.

HEX	RGB	CMYK	Name
0abbef	RGB(10, 187, 239)	CMYK(96, 22, 0, 6)	Cyan
1A1A1A	RGB(26, 26, 26)	CMYK(0, 0, 0, 90)	Black
F9FAFC	RGB(249, 250, 252)	CMYK(1, 1, 0, 1)	White
78828B	RGB(120, 130, 139)	CMYK(14, 6, 0, 45)	Gray
00244A	RGB(0, 36, 74)	CMYK(100, 51, 0, 71)	Black
45af70	RGB(69, 175, 112)	CMYK(61, 0, 36, 31)	Black
000000	RGB(0, 0, 0)	CMYK(0, 0, 0, 100)	Black
145784	RGB(20, 87, 132)	CMYK(85, 34, 0, 48)	Blue
009fe3	RGB(0, 159, 227)	CMYK(100, 30, 0, 11)	Cyan
545c62	RGB(84, 92, 98)	CMYK(14, 6, 0, 62)	Gray

Print Design Considerations

CMYK values for professional printing

0abbef

C:96 M:22 Y:0 K:6

1A1A1A

C:0 M:0 Y:0 K:90

F9FAFC

C:1 M:1 Y:0 K:1

78828B

C:14 M:6 Y:0 K:45

00244A

C:100 M:51 Y:0 K:71

45af70

C:61 M:0 Y:36 K:31

000000

C:0 M:0 Y:0 K:100

145784

C:85 M:34 Y:0 K:48

009fe3

C:100 M:30 Y:0 K:11

545c62

C:14 M:6 Y:0 K:62

Usage Examples

See how this color scheme works in different design contexts and get inspiration for your projects.

CSS Variables

Use these CSS custom properties in your stylesheets

:root {
  --color-1: 0abbef;
  --color-2: 1A1A1A;
  --color-3: F9FAFC;
  --color-4: 78828B;
  --color-5: 00244A;
  --color-6: 45af70;
  --color-7: 000000;
  --color-8: 145784;
  --color-9: 009fe3;
  --color-10: 545c62;
}

Text & Button Examples

See how text and buttons look on each color background

Cyan 0abbef

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Cyan background. The text color automatically adjusts to dark for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as light, so dark text provides optimal contrast for readability.

Black 1A1A1A

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Black background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

White F9FAFC

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the White background. The text color automatically adjusts to dark for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as light, so dark text provides optimal contrast for readability.

Gray 78828B

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Gray background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Black 00244A

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Black background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Black 45af70

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Black background. The text color automatically adjusts to dark for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as light, so dark text provides optimal contrast for readability.

Black 000000

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Black background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Blue 145784

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Blue background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Cyan 009fe3

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Cyan background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Gray 545c62

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Gray background. The text color automatically adjusts to light for optimal readability and accessibility.

Small text and secondary information also maintains good contrast and readability.

Card Title

Card content with subtle background overlay for depth and hierarchy.

Alert Message

Important information displayed with accent border.

Accessibility: This color is detected as dark, so light text provides optimal contrast for readability.

Related Color Schemes

Discover more beautiful color combinations

Backup ONE official

Color Palette Overview

Colors and Tints/Shades

Complete Color Information

Print Design Considerations

Usage Examples

CSS Variables

Text & Button Examples

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Heading Level 1

Heading Level 2

Heading Level 3

Card Title

Alert Message

Related Color Schemes

night sky!!!!

Midnight Calm

Pastel rainbow

my favorite colors:)