Named color · #C33140
C-3PO
C-3PO is #C33140: rgb(195 49 64), hsl(354 60% 48%), oklch(0.544 0.182 20.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · C-3PO color name →
#C33140
oklch(0.544 0.182 20.4)
Color conversions
- HEX
- #c33140
- RGB
- rgb(195 49 64)
- HSL
- hsl(354 60% 48%)
- HWB
- hwb(354 19% 24%)
- OKLCH
- oklch(0.544 0.182 20.4)
- OKLab
- oklab(0.544 0.17 0.063)
- CIE Lab
- lab(45.16 58.22 28.39)
- LCH
- lch(45.16 64.77 26)
- CMYK
- cmyk(0% 75% 67% 24%)
Tints · Shades · Tones
Tints
- CC4B52
- D46164
- DC7677
- E38A89
- E99E9C
- EFB1B0
- F4C5C3
- F8D8D7
- FCEBEB
Shades
- A92936
- 90222D
- 781A24
- 60131B
- 4A0C13
- 34060B
- 200305
- 0E0101
- 020000
Tones
- BE3E47
- B9484E
- B35254
- AD5A5B
- A76161
- A06867
- 996F6E
- 917574
- 897A7A
Color harmonies
Complementary +180°
- C33140
C-3PO
- 007F85
≈ Go Alpha
Analogous -30° +30°
- C33140
C-3PO
- B7347E
≈ Very Berry
- AF5100
≈ Cinnamon Bun
Triadic +120° +240°
- C33140
C-3PO
- 238700
≈ Green Bell Pepper
- 2869D7
≈ Flickr Blue
Split-complementary +150° +210°
- C33140
C-3PO
- 008367
≈ Bosphorus
- 007AA3
≈ CG Blue
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 5.47:1 · APCA Lc 76
Ag
FailOn black
WCAG 3.83:1 · APCA Lc 26
Best text color: #FFFFFF
WCAG 5.47:1 (AA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--c-3po: #c33140;
--c-3po-rgb: 195 49 64;
--c-3po-oklch: oklch(0.544 0.182 20.4);
}
.element {
color: var(--c-3po);
background-color: hsl(354 60% 48%);
border-color: oklch(0.544 0.182 20.4);
}Tailwind CSS v4
@theme {
--color-c-3po: #c33140;
--color-c-3po-50: #ffe1dd;
--color-c-3po-100: #ffd0cc;
--color-c-3po-200: #ffb5b1;
--color-c-3po-300: #ff8f8c;
--color-c-3po-400: #f76a70;
--color-c-3po-500: #e54150;
--color-c-3po-600: #c23944;
--color-c-3po-700: #9c2e36;
--color-c-3po-800: #741f29;
--color-c-3po-900: #52151b;
--color-c-3po-950: #36050c;
}SCSS
$c-3po: #c33140;
$c-3po-rgb: 195, 49, 64;
$c-3po-light: mix(#fff, $c-3po, 20%);
$c-3po-dark: mix(#000, $c-3po, 20%);
.element {
color: $c-3po;
box-shadow: 0 0 0 2px rgba($c-3po, 0.35);
}