Color Palette

Parametric Generation — Building

333C86
Copy As
HEX#333C86
RGBrgb(51,60,134)
HSLhsl(233, 45%, 36%)
CMYKcmyk(62%, 55%, 0%, 47%)
Download
SVG PNG
465396
Copy As
HEX#465396
RGBrgb(70,83,150)
HSLhsl(230, 36%, 43%)
CMYKcmyk(53%, 45%, 0%, 41%)
Download
SVG PNG
5A6BB0
Copy As
HEX#5A6BB0
RGBrgb(90,107,176)
HSLhsl(228, 35%, 52%)
CMYKcmyk(49%, 39%, 0%, 31%)
Download
SVG PNG
455076
Copy As
HEX#455076
RGBrgb(69,80,118)
HSLhsl(227, 26%, 37%)
CMYKcmyk(42%, 32%, 0%, 54%)
Download
SVG PNG
3A4368
Copy As
HEX#3A4368
RGBrgb(58,67,104)
HSLhsl(228, 28%, 32%)
CMYKcmyk(44%, 36%, 0%, 59%)
Download
SVG PNG
7284BC
Copy As
HEX#7284BC
RGBrgb(114,132,188)
HSLhsl(225, 36%, 59%)
CMYKcmyk(39%, 30%, 0%, 26%)
Download
SVG PNG
272D73
Copy As
HEX#272D73
RGBrgb(39,45,115)
HSLhsl(235, 49%, 30%)
CMYKcmyk(66%, 61%, 0%, 55%)
Download
SVG PNG
8C9BC3
Copy As
HEX#8C9BC3
RGBrgb(140,155,195)
HSLhsl(224, 31%, 66%)
CMYKcmyk(28%, 21%, 0%, 24%)
Download
SVG PNG
#333C86
#465396
#5A6BB0
#455076
#3A4368
#7284BC
#272D73
#8C9BC3
Parametric Generation

This palette was extracted from

Parametric Generation

Award-Winning Building

About the Design

This design features Dark Slate Blue, Steel Blue, Dark Slate Gray, Light Slate Gray, Midnight Blue, and Dark Gray.

About the Award-Winning Building Design: Parametric Generation is a residential town design created with the parametric tool Grasshopper. Buildings in the traditional style of eastern Sichuan are generated from a small set of parameters, such as length, width, height, eave size and roof slope. The individual buildings can be combined freely, and the complex covers about 100,000 square meters. Designers can add details to the generated models, and any revision is made by entering new parameters. The method keeps one architectural style across a whole town and shortens the design process.

This palette has a calming feel, creating serenity and focus.

View at A' Design Award

Parametric Generation, the source of these colors, was designed by Junming Chen.

Color Data for Professionals

Technical color information for designers and developers. Click any value to copy.


Dark Slate Blue
24.0% Purple
Web Formats
HEX#333C86
RGB51,60,134
HSLhsl(233, 45%, 36%)
HWBhwb(233, 20%, 47%)
Print & Design
CMYKcmyk(62%, 55%, 0%, 47%)
HSVhsv(233, 62%, 53%)
Perceptual (Color Science)
LABlab(28.53, 20.44, -42.78)
LCHlch(28.53, 47.41, 295.5°)
XYZxyz(7.28, 5.66, 23.26)
OKLaboklab(0.3918, 0.0087, -0.1227)
Accessibility (WCAG 2.1)
Aa
On White
9.85:1
AAA Pass
Aa
On Black
2.13:1
Fail
Aa
White on Color
9.85:1
AAA Pass
Aa
Black on Color
2.13:1
Fail
5.7%
Relative Luminance
0.0566
Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Dark Slate Blue
22.3% Purple
Web Formats
HEX#465396
RGB70,83,150
HSLhsl(230, 36%, 43%)
HWBhwb(230, 27%, 41%)
Print & Design
CMYKcmyk(53%, 45%, 0%, 41%)
HSVhsv(230, 53%, 59%)
Perceptual (Color Science)
LABlab(37.28, 14.91, -38.47)
LCHlch(37.28, 41.26, 291.2°)
XYZxyz(11.12, 9.69, 30.13)
OKLaboklab(0.4649, 0.006, -0.1093)
Accessibility (WCAG 2.1)
Aa
On White
7.15:1
AAA Pass
Aa
On Black
2.94:1
Fail
Aa
White on Color
7.15:1
AAA Pass
Aa
Black on Color
2.94:1
Fail
9.7%
Relative Luminance
0.0969
Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Steel Blue
15.4% Blue
Web Formats
HEX#5A6BB0
RGB90,107,176
HSLhsl(228, 35%, 52%)
HWBhwb(228, 35%, 31%)
Print & Design
CMYKcmyk(49%, 39%, 0%, 31%)
HSVhsv(228, 49%, 69%)
Perceptual (Color Science)
LABlab(46.74, 12.97, -38.8)
LCHlch(46.74, 40.91, 288.5°)
XYZxyz(17.31, 15.82, 43.21)
OKLaboklab(0.5456, 0.0036, -0.1096)
Accessibility (WCAG 2.1)
Aa
On White
5.04:1
AA Pass
Aa
On Black
4.16:1
Large Only
Aa
White on Color
5.04:1
AA Pass
Aa
Black on Color
4.16:1
Large Only
15.8%
Relative Luminance
0.1582
Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Dark Slate Blue
13.2% Purple
Web Formats
HEX#455076
RGB69,80,118
HSLhsl(227, 26%, 37%)
HWBhwb(227, 27%, 54%)
Print & Design
CMYKcmyk(42%, 32%, 0%, 54%)
HSVhsv(227, 42%, 46%)
Perceptual (Color Science)
LABlab(34.62, 6.21, -23.07)
LCHlch(34.62, 23.89, 285.1°)
XYZxyz(8.59, 8.31, 18.29)
OKLaboklab(0.4386, 0.0014, -0.0644)
Accessibility (WCAG 2.1)
Aa
On White
7.89:1
AAA Pass
Aa
On Black
2.66:1
Fail
Aa
White on Color
7.89:1
AAA Pass
Aa
Black on Color
2.66:1
Fail
8.3%
Relative Luminance
0.0831
Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Dark Slate Gray
8.5% Gray
Web Formats
HEX#3A4368
RGB58,67,104
HSLhsl(228, 28%, 32%)
HWBhwb(228, 23%, 59%)
Print & Design
CMYKcmyk(44%, 36%, 0%, 59%)
HSVhsv(228, 44%, 41%)
Perceptual (Color Science)
LABlab(29.19, 7.02, -22.8)
LCHlch(29.19, 23.86, 287.1°)
XYZxyz(6.25, 5.91, 13.91)
OKLaboklab(0.3921, 0.003, -0.0639)
Accessibility (WCAG 2.1)
Aa
On White
9.62:1
AAA Pass
Aa
On Black
2.18:1
Fail
Aa
White on Color
9.62:1
AAA Pass
Aa
Black on Color
2.18:1
Fail
5.9%
Relative Luminance
0.0591
Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Light Slate Gray
7.7% Gray
Web Formats
HEX#7284BC
RGB114,132,188
HSLhsl(225, 36%, 59%)
HWBhwb(225, 45%, 26%)
Print & Design
CMYKcmyk(39%, 30%, 0%, 26%)
HSVhsv(225, 39%, 74%)
Perceptual (Color Science)
LABlab(55.8, 7.72, -31.4)
LCHlch(55.8, 32.33, 283.8°)
XYZxyz(24.27, 23.71, 50.87)
OKLaboklab(0.6216, 0.0001, -0.0876)
Accessibility (WCAG 2.1)
Aa
On White
3.66:1
Large Only
Aa
On Black
5.74:1
AA Pass
Aa
White on Color
3.66:1
Large Only
Aa
Black on Color
5.74:1
AA Pass
23.7%
Relative Luminance
0.2371
Mid-tone

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Midnight Blue
4.5% Blue
Web Formats
HEX#272D73
RGB39,45,115
HSLhsl(235, 49%, 30%)
HWBhwb(235, 15%, 55%)
Print & Design
CMYKcmyk(66%, 61%, 0%, 55%)
HSVhsv(235, 66%, 45%)
Perceptual (Color Science)
LABlab(22.11, 21.43, -41.23)
LCHlch(22.11, 46.47, 297.5°)
XYZxyz(4.87, 3.55, 16.64)
OKLaboklab(0.337, 0.0091, -0.1186)
Accessibility (WCAG 2.1)
Aa
On White
12.29:1
AAA Pass
Aa
On Black
1.71:1
Fail
Aa
White on Color
12.29:1
AAA Pass
Aa
Black on Color
1.71:1
Fail
3.6%
Relative Luminance
0.0355
Very Dark

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.


Dark Gray
4.3% Gray
Web Formats
HEX#8C9BC3
RGB140,155,195
HSLhsl(224, 31%, 66%)
HWBhwb(224, 55%, 24%)
Print & Design
CMYKcmyk(28%, 21%, 0%, 24%)
HSVhsv(224, 28%, 76%)
Perceptual (Color Science)
LABlab(64.13, 3.85, -22.35)
LCHlch(64.13, 22.68, 279.8°)
XYZxyz(32.38, 32.96, 56.27)
OKLaboklab(0.692, -0.0014, -0.0615)
Accessibility (WCAG 2.1)
Aa
On White
2.77:1
Fail
Aa
On Black
7.59:1
AAA Pass
Aa
White on Color
2.77:1
Fail
Aa
Black on Color
7.59:1
AAA Pass
33.0%
Relative Luminance
0.3296
Mid-tone

Relative luminance defines the perceived brightness of a color. Values range from 0 (pure black) to 1 (pure white). This metric is essential for calculating WCAG contrast ratios.

The colors presented here were analyzed from Junming Chen's celebrated design "Parametric Generation".

Junming Chen

About the Designer

Junming Chen

Junming Chen is an award-winning creative director honored by the A' Design Award. Their portfolio demonstrates expertise in design and visual communication.

Junming Chen is a designer and programmer with a multidisciplinary background. He holds a BA in Architecture, an MS in Design, and an MS in Computing. Currently studying for a doctorate in digital media at Macau University of Science and Technology, and working in the Digital Construction Laboratory of Macau University of Science and Technology. Good at using parametric and artificial intelligence technology for design practice. He designed and built several parametric projects. He has also won many design awards and computer awards.

Discover more color palettes from Chen's award-winning work.

Silver A' Generative, Algorithmic, Parametric and AI-Assisted Design Award 2023

About the Award

Silver A' Generative, Algorithmic, Parametric and AI-Assisted Design Award 2023

Parametric Generation has been recognized with the Silver A' Generative, Algorithmic, Parametric and AI-Assisted Design Award in 2023. The A' Design Award is an internationally acknowledged design competition that recognizes outstanding creative accomplishment. Laureates are chosen through comprehensive judging by industry experts with diverse expertise in design. The Silver status reflects high caliber design work as determined by the international jury.

A' Generative, Algorithmic, Parametric and AI-Assisted Design Award

Celebrate the cutting-edge intersection of design and technology with entries that exemplify generative, algorithmic, parametric, and AI-assisted creativity. The generative award category highlights the synthesis of aesthetics and computational design techniques, showcasing innovation that redefines form, function, and user experience.

Recognizes: Algorithmic Artworks, Parametric Architectures, Generative Graphics, AI-Assisted Illustrations, Computational Sculptures, Procedural Patterns, Evolutionary Installations, Interactive Experiences and More.

More Palettes from Parametric Generation

Each image reveals a unique color story. Click to explore.

Parametric Generation - View 2
EDF1F9
88ABED
120A05
251F13
403528
6F5D4C
59493A
A1BEF3
Parametric Generation - View 3
E4EAF8
3D301F
5D6B80
282216
524D43
777F8D
2C2F2F
4E5D72
Parametric Generation - View 4
594D33
3C2A17
9FB9E0
675F4F
170D06
403B2F
B2C9E8
837762
Parametric Generation - View 5
F4F6F9
0C0904
262415
DDE6F0
3F3A26
736445
594F35
685C2D

Discover More Color Palettes

Explore colors from more award-winning designs.

Generate Images from Lines
D5D0C4
CCBBA2
956C43
B49977
CAA77A
A18666
7B5636
D2B68F
47,458 ID#150690
Technology Inheritance
615904
2B2211
3E361C
504709
DBE7F2
6F6905
4D6491
534828
45,040 ID#150834
Hinemosu 30
131313
282828
474747
676867
A9A9A9
808080
EEEEEE
373738
1,504,427 ID#159382
Changes and Cycles in Between
FEFEFE
2D2824
464034
575349
D1CDBC
B7BBB0
695F58
80806A
205,875 ID#170864
Flow
302F30
1B1A1B
424140
565351
646361
6B7577
7C929A
8FA7AA
174,028 ID#162336
Life Forms of Colors
0D0807
2C1A12
402B24
553934
654A45
5D3B50
7B6558
6C4862
172,950 ID#170854
Curiosity Blocks
033A72
0B62B4
034281
0A1520
FB802E
FBC833
FBD204
1F1C03
167,973 ID#170876
Reefit
090A0D
1A1B1D
344149
7F6B65
895E4B
55595E
342E2C
4B6B78
171,241 ID#171137
Shape Grammars
CDCDCD
E5E5E5
B8B8B8
9D9D9D
898989
F3F3F3
727272
010101
228,696 ID#130038
Flexo InForm
94684C
272619
3E3A28
634E32
7D7341
494A45
775D3E
5B5E64
703,824 ID#114604
Megalopolis X
E1E8F1
3B4B5E
4A5E76
9DB0D7
2A3742
5C718F
818592
121F35
990,487 ID#98037
Eden Rise
B5B6B6
ECE1D1
CCC6BF
9DA7AB
DAD2C9
4E3C37
DABB9A
332729
208,967 ID#164052