BrainRobotics

💖 1 likes

Created Jan 23, 2024

5 colors

Color Palette Overview

f18c20

5981C0

FDBA32

e6e7e8

3B4045

Colors and Tints/Shades

10% Lighter	5% Lighter	Original Color	5% Darker	10% Darker
#f4a652 Tint -10%	#f29a3a Tint -5%	f18c20 Original	#eb810f Shade +5%	#d3730d Shade +10%
#7e9cce Tint -10%	#6b8ec7 Tint -5%	5981C0 Original	#4672b9 Shade +5%	#3f67a6 Shade +10%
#fdca62 Tint -10%	#fdc149 Tint -5%	FDBA32 Original	#fdb017 Shade +5%	#f7a602 Shade +10%
#ffffff Tint -10%	#f4f5f5 Tint -5%	e6e7e8 Original	#dadbdd Shade +5%	#cdcfd0 Shade +10%
#525960 Tint -10%	#464d53 Tint -5%	3B4045 Original	#2f3337 Shade +5%	#232629 Shade +10%

Complete Color Information

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

HEX	RGB	CMYK	Name
f18c20	RGB(241, 140, 32)	CMYK(0, 42, 87, 5)	Orange
5981C0	RGB(89, 129, 192)	CMYK(54, 33, 0, 25)	Black
FDBA32	RGB(253, 186, 50)	CMYK(0, 26, 80, 1)	Orange
e6e7e8	RGB(230, 231, 232)	CMYK(1, 0, 0, 9)	White
3B4045	RGB(59, 64, 69)	CMYK(14, 7, 0, 73)	Gray

Print Design Considerations

CMYK values for professional printing

f18c20

C:0 M:42 Y:87 K:5

5981C0

C:54 M:33 Y:0 K:25

FDBA32

C:0 M:26 Y:80 K:1

e6e7e8

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

3B4045

C:14 M:7 Y:0 K:73

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: f18c20;
  --color-2: 5981C0;
  --color-3: FDBA32;
  --color-4: e6e7e8;
  --color-5: 3B4045;
}

Text & Button Examples

See how text and buttons look on each color background

Orange f18c20

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Orange 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 5981C0

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.

Orange FDBA32

Heading Level 1

Heading Level 2

Heading Level 3

This is regular paragraph text on the Orange 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.

White e6e7e8

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 3B4045

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

BrainRobotics

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

Related Color Schemes

night sky!!!!

Midnight Calm

Pastel rainbow

my favorite colors:)