Cinematic Garden
dark palette with a balanced five-color hierarchy for design use.
#Dark#Cinematic#Premium
COLOR 1
#0A3528
Pine Needle
COLOR 2
#0E6678
Art Deco Teal
COLOR 3
#97382A
Burnt Umber
COLOR 4
#D6C73C
Kariyasu Yellow
COLOR 5
#D4AEB9
Lychee Pink
Color Values & Codes
HEX · RGB · HSLOpen In Design Tools
CSS Variables
:root {
--color-1: #0A3528;
--color-2: #0E6678;
--color-3: #97382A;
--color-4: #D6C73C;
--color-5: #D4AEB9;
}Role-Based WCAG Contrast Audit
Accessibility contrast depends on assigned UI roles. Here are the contrast ratios and WCAG compliance ratings when pairing palette colors as Foreground Text against Background surfaces:
Sample Text
#0A3528 on #D6C73C7.79:1
Normal Text AA Pass
Sample Text
#0A3528 on #D4AEB96.80:1
Normal Text AA Pass
Sample Text
#0E6678 on #D6C73C3.79:1
Large Text Only (Pass)
Sample Text
#0E6678 on #D4AEB93.31:1
Large Text Only (Pass)
Sample Text
#97382A on #D6C73C4.15:1
Large Text Only (Pass)
Sample Text
#97382A on #D4AEB93.62:1
Large Text Only (Pass)