Benannte Farbe · #C4BF0B
Sweet & Sour
Sweet & Sour ist #C4BF0B: rgb(196 191 11), hsl(58 89% 41%), oklch(0.783 0.167 107.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Sweet & Sour color name →
#C4BF0B
oklch(0.783 0.167 107.8)
Farbumrechnungen
- HEX
- #c4bf0b
- RGB
- rgb(196 191 11)
- HSL
- hsl(58 89% 41%)
- HWB
- hwb(58 4% 23%)
- OKLCH
- oklch(0.783 0.167 107.8)
- OKLab
- oklab(0.783 -0.051 0.159)
- CIE Lab
- lab(75.85 -10.45 74.59)
- LCH
- lch(75.85 75.32 98)
- CMYK
- cmyk(0% 3% 94% 23%)
Tints · Shades · Tones
Tints
- C9C640
- CFCC5D
- D5D375
- DADA8B
- E0E09F
- E6E6B3
- ECEDC6
- F2F3D9
- F9F9EC
Shades
- AAA608
- 918D06
- 787504
- 615E02
- 4A4801
- 353301
- 211F00
- 0E0D00
- 020200
Tones
- BDB92F
- B6B341
- AFAC4E
- A8A659
- A1A062
- 9A9A69
- 939370
- 8D8D76
- 86877B
Farbharmonien
Komplementär +180°
- C4BF0B
Sweet & Sour
- B4ACFF
≈ Winterspring Lilac
Analog -30° +30°
- C4BF0B
Sweet & Sour
- F1A900
≈ Groovy Giraffe
- 80D161
≈ Fairy Tale Green
Triadisch +120° +240°
- C4BF0B
Sweet & Sour
- 31C9FF
≈ Vivid Sky Blue
- FF8DCA
≈ Shimmering Love
Geteilt komplementär +150° +210°
- C4BF0B
Sweet & Sour
- 8BBAFF
≈ Scenic Water
- E493FD
≈ Party Pig
Tetradisch +90° +180° +270°
- C4BF0B
Sweet & Sour
- 00D2D7
≈ Jade Glass
- B4ACFF
≈ Winterspring Lilac
- FF969A
≈ Mad Pinker
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.94:1 · APCA Lc 37
Ag
AAAAuf Schwarz
WCAG 10.80:1 · APCA Lc 65
Beste Textfarbe: #000000
WCAG 10.80:1 (AAA) · APCA Lc 65
Contrast pairs
Code-Snippets
CSS
:root {
--sweet-sour: #c4bf0b;
--sweet-sour-rgb: 196 191 11;
--sweet-sour-oklch: oklch(0.783 0.167 107.8);
}
.element {
color: var(--sweet-sour);
background-color: hsl(58 89% 41%);
border-color: oklch(0.783 0.167 107.8);
}Tailwind CSS v4
@theme {
--color-sweet-sour: #c4bf0b;
--color-sweet-sour-50: #f8fac3;
--color-sweet-sour-100: #ebedac;
--color-sweet-sour-200: #d8db85;
--color-sweet-sour-300: #bdbe4f;
--color-sweet-sour-400: #a9a400;
--color-sweet-sour-500: #938b00;
--color-sweet-sour-600: #7c7600;
--color-sweet-sour-700: #645e00;
--color-sweet-sour-800: #4b4400;
--color-sweet-sour-900: #342f00;
--color-sweet-sour-950: #201b00;
}SCSS
$sweet-sour: #c4bf0b;
$sweet-sour-rgb: 196, 191, 11;
$sweet-sour-light: mix(#fff, $sweet-sour, 20%);
$sweet-sour-dark: mix(#000, $sweet-sour, 20%);
.element {
color: $sweet-sour;
box-shadow: 0 0 0 2px rgba($sweet-sour, 0.35);
}