Nazwany kolor · #D208CC
Awkward Purple
Awkward Purple to #D208CC: rgb(210 8 204), hsl(302 93% 43%), oklch(0.604 0.273 329.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Awkward Purple color name →
#D208CC
oklch(0.604 0.273 329.9)
Konwersje koloru
- HEX
- #d208cc
- RGB
- rgb(210 8 204)
- HSL
- hsl(302 93% 43%)
- HWB
- hwb(302 3% 18%)
- OKLCH
- oklch(0.604 0.273 329.9)
- OKLab
- oklab(0.604 0.236 -0.137)
- CIE Lab
- lab(49.71 79.58 -48.95)
- LCH
- lch(49.71 93.43 328.4)
- CMYK
- cmyk(0% 96% 3% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D93ED2
- DF5BD8
- E572DE
- EB88E3
- EF9DE8
- F4B1ED
- F7C5F2
- FBD8F7
- FDECFB
Odcienie ciemniejsze
- B606B1
- 9B0497
- 81037E
- 680265
- 50014E
- 390137
- 240022
- 10000F
- 020002
Tony
- CB2DC5
- C43FBD
- BD4CB6
- B557AF
- AD60A7
- A568A0
- 9C6F98
- 947590
- 8A7B88
Harmonie kolorów
Komplementarna +180°
- D208CC
Awkward Purple
- 009B46
≈ Boogie Blast
Analogowa -30° +30°
- D208CC
Awkward Purple
- 9D47FF
≈ Irrigo Purple
- E8007C
≈ Mexican Pink
Triada +120° +240°
- D208CC
Awkward Purple
- 9E7D00
≈ Yellowish Brown
- 0092A4
≈ Oasis
Komplementarna rozszczepiona +150° +210°
- D208CC
Awkward Purple
- 778D00
≈ Canopy
- 009684
≈ Approval Green
Tetrada +90° +180° +270°
- D208CC
Awkward Purple
- BD6900
≈ Brown Orange
- 009B46
≈ Boogie Blast
- 008ACB
≈ Way Beyond the Blue
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.51:1 · APCA Lc 69
Ag
AANa czerni
WCAG 4.64:1 · APCA Lc 33
Najlepszy kolor tekstu: #000000
WCAG 4.64:1 (AA) · APCA Lc 33
Contrast pairs
Fragmenty kodu
CSS
:root {
--awkward-purple: #d208cc;
--awkward-purple-rgb: 210 8 204;
--awkward-purple-oklch: oklch(0.604 0.273 329.9);
}
.element {
color: var(--awkward-purple);
background-color: hsl(302 93% 43%);
border-color: oklch(0.604 0.273 329.9);
}Tailwind CSS v4
@theme {
--color-awkward-purple: #d208cc;
--color-awkward-purple-50: #ffd9ff;
--color-awkward-purple-100: #ffc6ff;
--color-awkward-purple-200: #ffa6ff;
--color-awkward-purple-300: #ff79f4;
--color-awkward-purple-400: #f04be9;
--color-awkward-purple-500: #de00d8;
--color-awkward-purple-600: #bc00b7;
--color-awkward-purple-700: #970093;
--color-awkward-purple-800: #6f0070;
--color-awkward-purple-900: #4e014f;
--color-awkward-purple-950: #340035;
}SCSS
$awkward-purple: #d208cc;
$awkward-purple-rgb: 210, 8, 204;
$awkward-purple-light: mix(#fff, $awkward-purple, 20%);
$awkward-purple-dark: mix(#000, $awkward-purple, 20%);
.element {
color: $awkward-purple;
box-shadow: 0 0 0 2px rgba($awkward-purple, 0.35);
}