Nazwany kolor · #CC9922
Duck Sauce
Duck Sauce to #CC9922: rgb(204 153 34), hsl(42 71% 47%), oklch(0.713 0.138 82.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Duck Sauce color name →
#CC9922
oklch(0.713 0.138 82.8)
Konwersje koloru
- HEX
- #cc9922
- RGB
- rgb(204 153 34)
- HSL
- hsl(42 71% 47%)
- HWB
- hwb(42 13% 20%)
- OKLCH
- oklch(0.713 0.138 82.8)
- OKLab
- oklab(0.713 0.017 0.137)
- CIE Lab
- lab(66.8 12.32 63.81)
- LCH
- lch(66.8 64.99 79.1)
- CMYK
- cmyk(0% 25% 83% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D1A344
- D7AE5D
- DCB873
- E1C288
- E6CC9D
- EBD7B1
- F0E1C4
- F5EBD8
- FAF5EB
Odcienie ciemniejsze
- B1841C
- 977016
- 7E5D11
- 654A0B
- 4E3807
- 372703
- 221701
- 0F0800
- 020100
Tony
- C49736
- BD9543
- B5924E
- AD9058
- A68E60
- 9E8B67
- 97886E
- 8F8674
- 88837A
Harmonie kolorów
Komplementarna +180°
- CC9922
Duck Sauce
- 74A1F8
≈ Fennel Flower
Analogowa -30° +30°
- CC9922
Duck Sauce
- E48849
≈ Orange Poppy
- A4AB36
≈ Sphagnales Moss
Triada +120° +240°
- CC9922
Duck Sauce
- 00B8C4
≈ Lago Blue
- CB83D4
≈ Purception
Komplementarna rozszczepiona +150° +210°
- CC9922
Duck Sauce
- 27B0EA
≈ Lynx Screen Blue
- A691F0
≈ Dull Lavender
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.57:1 · APCA Lc 50
Ag
AAANa czerni
WCAG 8.14:1 · APCA Lc 52
Najlepszy kolor tekstu: #000000
WCAG 8.14:1 (AAA) · APCA Lc 52
Contrast pairs
Fragmenty kodu
CSS
:root {
--duck-sauce: #cc9922;
--duck-sauce-rgb: 204 153 34;
--duck-sauce-oklch: oklch(0.713 0.138 82.8);
}
.element {
color: var(--duck-sauce);
background-color: hsl(42 71% 47%);
border-color: oklch(0.713 0.138 82.8);
}Tailwind CSS v4
@theme {
--color-duck-sauce: #cc9922;
--color-duck-sauce-50: #fff3c9;
--color-duck-sauce-100: #fde5b4;
--color-duck-sauce-200: #f0d08f;
--color-duck-sauce-300: #d8b260;
--color-duck-sauce-400: #c6962a;
--color-duck-sauce-500: #b27b00;
--color-duck-sauce-600: #966800;
--color-duck-sauce-700: #795300;
--color-duck-sauce-800: #5a3c00;
--color-duck-sauce-900: #3f2900;
--color-duck-sauce-950: #281700;
}SCSS
$duck-sauce: #cc9922;
$duck-sauce-rgb: 204, 153, 34;
$duck-sauce-light: mix(#fff, $duck-sauce, 20%);
$duck-sauce-dark: mix(#000, $duck-sauce, 20%);
.element {
color: $duck-sauce;
box-shadow: 0 0 0 2px rgba($duck-sauce, 0.35);
}