Strategy Colors

Color Palette

Leaf Roof — Solar Panel Collection

303F4A
Copy As
HEX#303F4A
RGBrgb(48,63,74)
HSLhsl(205, 21%, 24%)
CMYKcmyk(35%, 15%, 0%, 71%)
Download
SVG PNG
505B5E
Copy As
HEX#505B5E
RGBrgb(80,91,94)
HSLhsl(193, 8%, 34%)
CMYKcmyk(15%, 3%, 0%, 63%)
Download
SVG PNG
717777
Copy As
HEX#717777
RGBrgb(113,119,119)
HSLhsl(180, 3%, 45%)
CMYKcmyk(5%, 0%, 0%, 53%)
Download
SVG PNG
6594AD
Copy As
HEX#6594AD
RGBrgb(101,148,173)
HSLhsl(201, 31%, 54%)
CMYKcmyk(42%, 14%, 0%, 32%)
Download
SVG PNG
7AA4B8
Copy As
HEX#7AA4B8
RGBrgb(122,164,184)
HSLhsl(199, 30%, 60%)
CMYKcmyk(34%, 11%, 0%, 28%)
Download
SVG PNG
B4C8D2
Copy As
HEX#B4C8D2
RGBrgb(180,200,210)
HSLhsl(200, 25%, 76%)
CMYKcmyk(14%, 5%, 0%, 18%)
Download
SVG PNG
8E918D
Copy As
HEX#8E918D
RGBrgb(142,145,141)
HSLhsl(105, 2%, 56%)
CMYKcmyk(2%, 0%, 3%, 43%)
Download
SVG PNG
414E54
Copy As
HEX#414E54
RGBrgb(65,78,84)
HSLhsl(199, 13%, 29%)
CMYKcmyk(23%, 7%, 0%, 67%)
Download
SVG PNG
#303F4A
#505B5E
#717777
#6594AD
#7AA4B8
#B4C8D2
#8E918D
#414E54
Leaf Roof

This palette was extracted from

Leaf Roof

Award-Winning Solar Panel Collection

About the Design

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

About the Award-Winning Solar Panel Collection Design: Leaf Roof is a carport with a solar panel roof shaped like a leaf. The structure measures 5 by 7 by 3 metres and is made of carbon fibre reinforced polymers and transparent photovoltaic glass. Bifacial solar panels collect sunlight on both sides and can generate up to 5 kilowatt peak. The electricity charges electric vehicles parked below and supports household power. A connected application allows monitoring of energy production and use in real time. The leaf shape refers to the way leaves gather sunlight in nature.

This palette has a cool feel, creating peaceful balance.

View at A' Design Award

Leaf Roof, the source of these colors, was designed by Tomi Rantasaari.

Color Data for Professionals

Technical color information for designers and developers. Click any value to copy.
#303F4A
Dark Slate Gray
25.8% Gray
Web Formats
HEX#303F4A
RGB48,63,74
HSLhsl(205, 21%, 24%)
HWBhwb(205, 19%, 71%)
Print & Design
CMYKcmyk(35%, 15%, 0%, 71%)
HSVhsv(205, 35%, 29%)
Perceptual (Color Science)
LABlab(25.8, -2.94, -8.65)
LCHlch(25.8, 9.14, 251.3°)
XYZxyz(4.23, 4.68, 7.16)
OKLaboklab(0.3591, -0.0135, -0.0237)
Accessibility (WCAG 2.1)
Aa
On White
10.85:1
AAA Pass
Aa
On Black
1.94:1
Fail
Aa
White on Color
10.85:1
AAA Pass
Aa
Black on Color
1.94:1
Fail
4.7%
Relative Luminance
0.0468
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.

Color Relationships & Derivatives
#4A3B30
Complementary
of Dark Slate Gray
#30324A
Analogous
of Dark Slate Gray
#304A48
Analogous
of Dark Slate Gray
#4F6778
Lighter Tint
of Dark Slate Gray
#718EA2
Lighter Tint
of Dark Slate Gray
#9FB3C1
Lighter Tint
of Dark Slate Gray
#12181C
Darker Shade
of Dark Slate Gray
#0A0D0F
Darker Shade
of Dark Slate Gray
#0A0D0F
Darker Shade
of Dark Slate Gray
Dark Slate Gray
Named Color
Discover the Hue
#505B5E
Dim Gray
14.5% Gray
Web Formats
HEX#505B5E
RGB80,91,94
HSLhsl(193, 8%, 34%)
HWBhwb(193, 31%, 63%)
Print & Design
CMYKcmyk(15%, 3%, 0%, 63%)
HSVhsv(193, 15%, 37%)
Perceptual (Color Science)
LABlab(37.83, -3.57, -3.18)
LCHlch(37.83, 4.77, 221.7°)
XYZxyz(9.07, 10, 12.04)
OKLaboklab(0.4627, -0.0118, -0.0086)
Accessibility (WCAG 2.1)
Aa
On White
7.00:1
AAA Pass
Aa
On Black
3.00:1
Large Only
Aa
White on Color
7.00:1
AAA Pass
Aa
Black on Color
3.00:1
Large Only
10.0%
Relative Luminance
0.1000
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.

Color Relationships & Derivatives
#5E5350
Complementary
of Dim Gray
#50545E
Analogous
of Dim Gray
#505E5A
Analogous
of Dim Gray
#738387
Lighter Tint
of Dim Gray
#9CA7AB
Lighter Tint
of Dim Gray
#C5CCCE
Lighter Tint
of Dim Gray
#2D3334
Darker Shade
of Dim Gray
#0C0D0E
Darker Shade
of Dim Gray
#0C0D0E
Darker Shade
of Dim Gray
Dim Gray
Named Color
Discover the Hue
#717777
Gray
13.9% Gray
Web Formats
HEX#717777
RGB113,119,119
HSLhsl(180, 3%, 45%)
HWBhwb(180, 44%, 53%)
Print & Design
CMYKcmyk(5%, 0%, 0%, 53%)
HSVhsv(180, 5%, 47%)
Perceptual (Color Science)
LABlab(49.54, -2.25, -0.78)
LCHlch(49.54, 2.38, 199.1°)
XYZxyz(16.74, 18.04, 20.05)
OKLaboklab(0.5641, -0.0069, -0.0021)
Accessibility (WCAG 2.1)
Aa
On White
4.56:1
AA Pass
Aa
On Black
4.61:1
AA Pass
Aa
White on Color
4.56:1
AA Pass
Aa
Black on Color
4.61:1
AA Pass
18.0%
Relative Luminance
0.1804
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.

Color Relationships & Derivatives
#766F6F
Complementary
of Gray
#6F7376
Analogous
of Gray
#6F7673
Analogous
of Gray
#969C9C
Lighter Tint
of Gray
#BDC1C1
Lighter Tint
of Gray
#E5E6E6
Lighter Tint
of Gray
#4A4F4F
Darker Shade
of Gray
#252727
Darker Shade
of Gray
#0C0D0D
Darker Shade
of Gray
Gray
Named Color
Discover the Hue
#6594AD
Cadet Blue
11.9% Cyan
Web Formats
HEX#6594AD
RGB101,148,173
HSLhsl(201, 31%, 54%)
HWBhwb(201, 40%, 32%)
Print & Design
CMYKcmyk(42%, 14%, 0%, 32%)
HSVhsv(201, 42%, 68%)
Perceptual (Color Science)
LABlab(58.94, -9.21, -18.09)
LCHlch(58.94, 20.3, 243°)
XYZxyz(23.5, 26.96, 43.49)
OKLaboklab(0.6423, -0.0386, -0.0499)
Accessibility (WCAG 2.1)
Aa
On White
3.28:1
Large Only
Aa
On Black
6.39:1
AA Pass
Aa
White on Color
3.28:1
Large Only
Aa
Black on Color
6.39:1
AA Pass
27.0%
Relative Luminance
0.2696
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.

Color Relationships & Derivatives
#AE7F65
Complementary
of Cadet Blue
#6570AE
Analogous
of Cadet Blue
#65AEA3
Analogous
of Cadet Blue
#97B7C8
Lighter Tint
of Cadet Blue
#CADAE3
Lighter Tint
of Cadet Blue
#EEF3F6
Lighter Tint
of Cadet Blue
#456D82
Darker Shade
of Cadet Blue
#2A4350
Darker Shade
of Cadet Blue
#10191E
Darker Shade
of Cadet Blue
Cadet Blue
Named Color
Discover the Hue
#7AA4B8
Cadet Blue
9.4% Cyan
Web Formats
HEX#7AA4B8
RGB122,164,184
HSLhsl(199, 30%, 60%)
HWBhwb(199, 48%, 28%)
Print & Design
CMYKcmyk(34%, 11%, 0%, 28%)
HSVhsv(199, 34%, 72%)
Perceptual (Color Science)
LABlab(65.08, -9.24, -14.87)
LCHlch(65.08, 17.5, 238.2°)
XYZxyz(29.95, 34.15, 50.35)
OKLaboklab(0.6953, -0.0356, -0.0408)
Accessibility (WCAG 2.1)
Aa
On White
2.68:1
Fail
Aa
On Black
7.83:1
AAA Pass
Aa
White on Color
2.68:1
Fail
Aa
Black on Color
7.83:1
AAA Pass
34.2%
Relative Luminance
0.3415
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.

Color Relationships & Derivatives
#B88E7A
Complementary
of Cadet Blue
#7A86B8
Analogous
of Cadet Blue
#7AB8AC
Analogous
of Cadet Blue
#ACC6D2
Lighter Tint
of Cadet Blue
#DEE8ED
Lighter Tint
of Cadet Blue
#EEF4F6
Lighter Tint
of Cadet Blue
#507F95
Darker Shade
of Cadet Blue
#365563
Darker Shade
of Cadet Blue
#1B2A32
Darker Shade
of Cadet Blue
Cadet Blue
Named Color
Discover the Hue
#B4C8D2
Light Steel Blue
9.3% Blue
Web Formats
HEX#B4C8D2
RGB180,200,210
HSLhsl(200, 25%, 76%)
HWBhwb(200, 71%, 18%)
Print & Design
CMYKcmyk(14%, 5%, 0%, 18%)
HSVhsv(200, 14%, 82%)
Perceptual (Color Science)
LABlab(79.42, -4.72, -7.28)
LCHlch(79.42, 8.67, 237°)
XYZxyz(51.11, 55.66, 69.01)
OKLaboklab(0.8208, -0.0169, -0.0196)
Accessibility (WCAG 2.1)
Aa
On White
1.73:1
Fail
Aa
On Black
12.13:1
AAA Pass
Aa
White on Color
1.73:1
Fail
Aa
Black on Color
12.13:1
AAA Pass
55.7%
Relative Luminance
0.5566
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.

Color Relationships & Derivatives
#D1BDB3
Complementary
of Light Steel Blue
#B3B8D1
Analogous
of Light Steel Blue
#B3D1CC
Analogous
of Light Steel Blue
#E2EAEE
Lighter Tint
of Light Steel Blue
#EFF3F5
Lighter Tint
of Light Steel Blue
#EFF3F5
Lighter Tint
of Light Steel Blue
#83A4B4
Darker Shade
of Light Steel Blue
#587F93
Darker Shade
of Light Steel Blue
#3B5663
Darker Shade
of Light Steel Blue
Light Steel Blue
Named Color
Discover the Hue
#8E918D
Light Slate Gray
7.9% Gray
Web Formats
HEX#8E918D
RGB142,145,141
HSLhsl(105, 2%, 56%)
HWBhwb(105, 55%, 43%)
Print & Design
CMYKcmyk(2%, 0%, 3%, 43%)
HSVhsv(105, 3%, 57%)
Perceptual (Color Science)
LABlab(59.82, -1.87, 1.74)
LCHlch(59.82, 2.55, 137.2°)
XYZxyz(26.09, 27.92, 29.21)
OKLaboklab(0.6529, -0.005, 0.0046)
Accessibility (WCAG 2.1)
Aa
On White
3.19:1
Large Only
Aa
On Black
6.58:1
AA Pass
Aa
White on Color
3.19:1
Large Only
Aa
Black on Color
6.58:1
AA Pass
27.9%
Relative Luminance
0.2792
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.

Color Relationships & Derivatives
#908D91
Complementary
of Light Slate Gray
#8D918E
Analogous
of Light Slate Gray
#90918D
Analogous
of Light Slate Gray
#B4B7B4
Lighter Tint
of Light Slate Gray
#DBDCDB
Lighter Tint
of Light Slate Gray
#F2F3F2
Lighter Tint
of Light Slate Gray
#686B66
Darker Shade
of Light Slate Gray
#424441
Darker Shade
of Light Slate Gray
#1C1D1B
Darker Shade
of Light Slate Gray
Light Slate Gray
Named Color
Discover the Hue
#414E54
Dark Slate Gray
7.3% Gray
Web Formats
HEX#414E54
RGB65,78,84
HSLhsl(199, 13%, 29%)
HWBhwb(199, 25%, 67%)
Print & Design
CMYKcmyk(23%, 7%, 0%, 67%)
HSVhsv(199, 23%, 33%)
Perceptual (Color Science)
LABlab(32.29, -3.62, -5.25)
LCHlch(32.29, 6.38, 235.5°)
XYZxyz(6.5, 7.21, 9.44)
OKLaboklab(0.4148, -0.0131, -0.0142)
Accessibility (WCAG 2.1)
Aa
On White
8.60:1
AAA Pass
Aa
On Black
2.44:1
Fail
Aa
White on Color
8.60:1
AAA Pass
Aa
Black on Color
2.44:1
Fail
7.2%
Relative Luminance
0.0721
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.

Color Relationships & Derivatives
#544640
Complementary
of Dark Slate Gray
#404454
Analogous
of Dark Slate Gray
#405450
Analogous
of Dark Slate Gray
#62767F
Lighter Tint
of Dark Slate Gray
#899BA4
Lighter Tint
of Dark Slate Gray
#B4C0C5
Lighter Tint
of Dark Slate Gray
#1F2528
Darker Shade
of Dark Slate Gray
#0B0D0E
Darker Shade
of Dark Slate Gray
#0B0D0E
Darker Shade
of Dark Slate Gray
Dark Slate Gray
Named Color
Discover the Hue

These colors were identified within Tomi Rantasaari's award-winning project "Leaf Roof".

Tomi Rantasaari

About the Designer

Tomi Rantasaari

Tomi Rantasaari is an acclaimed design visionary recognized by the A' Design Award. Their creative vision reflects exceptional skill in creative direction.

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

Explore Rantasaari's Palettes View Rantasaari's Profile
Iron A' Generative, Algorithmic, Parametric and AI-Assisted Design Award 2024

About the Award

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

Leaf Roof was honored with the Iron A' Generative, Algorithmic, Parametric and AI-Assisted Design Award in 2024. The A' Design Award is a globally recognized design award program that acknowledges exceptional design innovation. Winners are selected through thorough review by a distinguished panel comprising academics, professionals and press members. The Iron status indicates commendable design excellence as assessed by the judging body.

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.
Learn More About A' Generative, Algorithmic, Parametric and AI-Assisted Design Award View at A' Design Award

More Palettes from Leaf Roof

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

Leaf Roof - View 2
18260E
545860
6E727C
1B232E
2A3917
3C444D
3F4B1F
312921
Leaf Roof • View 2
Leaf Roof - View 3
1C2533
424951
5B5F63
303742
828282
6E7072
97ADBC
D3D8DA
Leaf Roof • View 3
Leaf Roof - View 4
1E2630
9E805F
40362F
313D4B
756253
86837E
B79976
42505C
Leaf Roof • View 4
Leaf Roof - View 5
30321F
44442F
1A2113
5F6637
6A665C
827E71
58554B
3C4A5B
Leaf Roof • View 5

Discover More Color Palettes

Explore colors from more award-winning designs.

Lumous
F1F7FD
A2A6D1
C8D4E9
383C57
252A3E
69759A
484E6F
586287
Lumous
59,224 ID#169344
Voltti
09080B
1C1B1F
1D2531
4F3A2B
342922
736155
424148
614F43
Voltti
60,805 ID#169605
Hinemosu 30
131313
282828
474747
676867
A9A9A9
808080
EEEEEE
373738
Hinemosu 30
1,504,427 ID#159382
Changes and Cycles in Between
FEFEFE
2D2824
464034
575349
D1CDBC
B7BBB0
695F58
80806A
Changes and Cycles in Between
205,875 ID#170864
Flow
302F30
1B1A1B
424140
565351
646361
6B7577
7C929A
8FA7AA
Flow
174,028 ID#162336
Life Forms of Colors
0D0807
2C1A12
402B24
553934
654A45
5D3B50
7B6558
6C4862
Life Forms of Colors
172,950 ID#170854
Curiosity Blocks
033A72
0B62B4
034281
0A1520
FB802E
FBC833
FBD204
1F1C03
Curiosity Blocks
167,973 ID#170876
Reefit
090A0D
1A1B1D
344149
7F6B65
895E4B
55595E
342E2C
4B6B78
Reefit
171,241 ID#171137
Shape Grammars
CDCDCD
E5E5E5
B8B8B8
9D9D9D
898989
F3F3F3
727272
010101
Shape Grammars
228,696 ID#130038
Flexo InForm
94684C
272619
3E3A28
634E32
7D7341
494A45
775D3E
5B5E64
Flexo InForm
703,824 ID#114604
Megalopolis X
E1E8F1
3B4B5E
4A5E76
9DB0D7
2A3742
5C718F
818592
121F35
Megalopolis X
990,487 ID#98037
Eden Rise
B5B6B6
ECE1D1
CCC6BF
9DA7AB
DAD2C9
4E3C37
DABB9A
332729
Eden Rise
208,967 ID#164052