Benannte Farbe · #D5C757
Citron
Citron ist #D5C757: rgb(213 199 87), hsl(53 60% 59%), oklch(0.82 0.133 102.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Citron color name →
#D5C757
oklch(0.82 0.133 102.2)
Farbumrechnungen
- HEX
- #d5c757
- RGB
- rgb(213 199 87)
- HSL
- hsl(53 60% 59%)
- HWB
- hwb(53 34% 16%)
- OKLCH
- oklch(0.82 0.133 102.2)
- OKLab
- oklab(0.82 -0.028 0.13)
- CIE Lab
- lab(79.8 -4.97 56.39)
- LCH
- lch(79.8 56.61 95)
- CMYK
- cmyk(0% 7% 59% 16%)
Tints · Shades · Tones
Tints
- D9CD6B
- DDD37E
- E1D890
- E5DEA0
- E9E4B1
- EEE9C1
- F2EFD0
- F6F4E0
- FBFAF0
Shades
- B9AD4B
- 9E933E
- 837A33
- 6A6227
- 514C1C
- 3A3612
- 242108
- 100E03
- 020200
Tones
- CCC05E
- C3B965
- BAB26A
- B2AB6F
- A9A373
- A19C76
- 989579
- 908E7C
- 88877E
Farbharmonien
Komplementär +180°
- D5C757
Citron
- BABDFF
≈ Dried Lilac
Analog -30° +30°
- D5C757
Citron
- F9B559
≈ Amber Yellow
- A3D679
≈ Crystal Green
Triadisch +120° +240°
- D5C757
Citron
- 51D6FF
≈ Libra Blue Morpho
- FFA0DC
≈ Rose Daphne
Geteilt komplementär +150° +210°
- D5C757
Citron
- 98C8FF
≈ Apocyan
- E0ACFF
≈ Testosterose
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.73:1 · APCA Lc 31
Ag
AAAAuf Schwarz
WCAG 12.13:1 · APCA Lc 72
Beste Textfarbe: #000000
WCAG 12.13:1 (AAA) · APCA Lc 72
Contrast pairs
Code-Snippets
CSS
:root {
--citron: #d5c757;
--citron-rgb: 213 199 87;
--citron-oklch: oklch(0.82 0.133 102.2);
}
.element {
color: var(--citron);
background-color: hsl(53 60% 59%);
border-color: oklch(0.82 0.133 102.2);
}Tailwind CSS v4
@theme {
--color-citron: #d5c757;
--color-citron-50: #fbf8cc;
--color-citron-100: #efebb8;
--color-citron-200: #ddd895;
--color-citron-300: #c2bb67;
--color-citron-400: #aea135;
--color-citron-500: #988800;
--color-citron-600: #817300;
--color-citron-700: #675c00;
--color-citron-800: #4d4300;
--color-citron-900: #362e00;
--color-citron-950: #211b00;
}SCSS
$citron: #d5c757;
$citron-rgb: 213, 199, 87;
$citron-light: mix(#fff, $citron, 20%);
$citron-dark: mix(#000, $citron, 20%);
.element {
color: $citron;
box-shadow: 0 0 0 2px rgba($citron, 0.35);
}