لون مسمّى · #9BCB96
Kettle Drum
Kettle Drum هو #9BCB96: rgb(155 203 150)، hsl(114 34% 69%)، oklch(0.794 0.089 142.3). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Green mean? → · Kettle Drum color name →
#9BCB96
oklch(0.794 0.089 142.3)
تحويلات الألوان
- HEX
- #9bcb96
- RGB
- rgb(155 203 150)
- HSL
- hsl(114 34% 69%)
- HWB
- hwb(114 59% 20%)
- OKLCH
- oklch(0.794 0.089 142.3)
- OKLab
- oklab(0.794 -0.071 0.055)
- CIE Lab
- lab(77.25 -23.98 21.22)
- LCH
- lch(77.25 32.02 138.5)
- CMYK
- cmyk(24% 0% 26% 20%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- A5D0A0
- AFD6AB
- B9DBB5
- C3E0C0
- CDE5CA
- D7EAD5
- E1F0DF
- EBF5EA
- F5FAF4
درجات داكنة
- 86B082
- 72966E
- 5E7D5B
- 4B6549
- 394D37
- 283726
- 182216
- 090F08
- 010201
درجات رمادية
- 99C394
- 96BC92
- 93B490
- 91AD8E
- 8EA58C
- 8B9E89
- 899687
- 868F85
- 838782
تناسق الألوان
متمم +180°
- 9BCB96
Kettle Drum
- D8A9DE
≈ Barely Bloomed
متجاور -30° +30°
- 9BCB96
Kettle Drum
- BDC27E
≈ Pine Glade
- 7CCFB6
≈ Lavish Green
ثلاثي +120° +240°
- 9BCB96
Kettle Drum
- 9DBCF6
≈ Pastel Blue
- F0A5A2
≈ Calabrese
متمم منقسم +150° +210°
- 9BCB96
Kettle Drum
- BDB2F1
≈ Purple Sand
- E9A4C2
≈ Think Pink
رباعي +90° +180° +270°
- 9BCB96
Kettle Drum
- 7FC6EC
≈ Fish Pond
- D8A9DE
≈ Barely Bloomed
- EAAC86
≈ Coral Dust
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.84:1 · APCA Lc 35
Ag
AAAعلى الأسود
WCAG 11.37:1 · APCA Lc 68
أفضل لون للنص: #000000
WCAG 11.37:1 (AAA) · APCA Lc 68
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--kettle-drum: #9bcb96;
--kettle-drum-rgb: 155 203 150;
--kettle-drum-oklch: oklch(0.794 0.089 142.3);
}
.element {
color: var(--kettle-drum);
background-color: hsl(114 34% 69%);
border-color: oklch(0.794 0.089 142.3);
}Tailwind CSS v4
@theme {
--color-kettle-drum: #9bcb96;
--color-kettle-drum-50: #e6fce6;
--color-kettle-drum-100: #d7f0d6;
--color-kettle-drum-200: #bedfbd;
--color-kettle-drum-300: #9cc49b;
--color-kettle-drum-400: #80ac7b;
--color-kettle-drum-500: #62955e;
--color-kettle-drum-600: #547e50;
--color-kettle-drum-700: #43653f;
--color-kettle-drum-800: #314a2c;
--color-kettle-drum-900: #21331e;
--color-kettle-drum-950: #111f0e;
}SCSS
$kettle-drum: #9bcb96;
$kettle-drum-rgb: 155, 203, 150;
$kettle-drum-light: mix(#fff, $kettle-drum, 20%);
$kettle-drum-dark: mix(#000, $kettle-drum, 20%);
.element {
color: $kettle-drum;
box-shadow: 0 0 0 2px rgba($kettle-drum, 0.35);
}