Named color · #20C073
Times Square Screens
Times Square Screens is #20C073: rgb(32 192 115), hsl(151 71% 44%), oklch(0.713 0.168 155.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Times Square Screens color name →
#20C073
oklch(0.713 0.168 155.4)
Color conversions
- HEX
- #20c073
- RGB
- rgb(32 192 115)
- HSL
- hsl(151 71% 44%)
- HWB
- hwb(151 13% 25%)
- OKLCH
- oklch(0.713 0.168 155.4)
- OKLab
- oklab(0.713 -0.152 0.07)
- CIE Lab
- lab(68.86 -53.97 27.31)
- LCH
- lch(68.86 60.49 153.2)
- CMYK
- cmyk(83% 0% 40% 25%)
Tints · Shades · Tones
Tints
- 49C781
- 64CD8F
- 7BD49D
- 90DAAB
- A4E1B8
- B7E7C6
- C9EDD4
- DBF3E3
- EDF9F1
Shades
- 1AA763
- 158E54
- 0F7645
- 0A5F36
- 064928
- 03341B
- 01200F
- 000E05
- 000201
Tones
- 39BA75
- 48B477
- 54AD78
- 5EA77A
- 66A17B
- 6C9A7C
- 72947D
- 778D7E
- 7C877F
Color harmonies
Complementary +180°
- 20C073
Times Square Screens
- E175CB
≈ Explicit Pink
Analogous -30° +30°
- 20C073
Times Square Screens
- 8AB425
≈ Outrageous Green
- 00BBAD
≈ Turquoise Topaz
Triadic +120° +240°
- 20C073
Times Square Screens
- 8998FF
≈ Periwinkle Blue
- F87655
≈ Adventure Island Pink
Split-complementary +150° +210°
- 20C073
Times Square Screens
- BC84F5
≈ Lilac Geode
- F56F93
≈ Out of Fashion
Tetradic +90° +180° +270°
- 20C073
Times Square Screens
- 35AAFF
≈ Xed
- E175CB
≈ Explicit Pink
- E48A00
≈ Hotter Butter
Contrast & accessibility
Ag
FailOn white
WCAG 2.37:1 · APCA Lc 46
Ag
AAAOn black
WCAG 8.84:1 · APCA Lc 56
Best text color: #000000
WCAG 8.84:1 (AAA) · APCA Lc 56
Contrast pairs
Code snippets
CSS
:root {
--times-square-screens: #20c073;
--times-square-screens-rgb: 32 192 115;
--times-square-screens-oklch: oklch(0.713 0.168 155.4);
}
.element {
color: var(--times-square-screens);
background-color: hsl(151 71% 44%);
border-color: oklch(0.713 0.168 155.4);
}Tailwind CSS v4
@theme {
--color-times-square-screens: #20c073;
--color-times-square-screens-50: #ceffe3;
--color-times-square-screens-100: #b9f9d2;
--color-times-square-screens-200: #95eab8;
--color-times-square-screens-300: #63d195;
--color-times-square-screens-400: #2bbb72;
--color-times-square-screens-500: #00a452;
--color-times-square-screens-600: #008b46;
--color-times-square-screens-700: #007038;
--color-times-square-screens-800: #005224;
--color-times-square-screens-900: #003918;
--color-times-square-screens-950: #002309;
}SCSS
$times-square-screens: #20c073;
$times-square-screens-rgb: 32, 192, 115;
$times-square-screens-light: mix(#fff, $times-square-screens, 20%);
$times-square-screens-dark: mix(#000, $times-square-screens, 20%);
.element {
color: $times-square-screens;
box-shadow: 0 0 0 2px rgba($times-square-screens, 0.35);
}