Nazwany kolor · #9BCB96
Kettle Drum
Kettle Drum to #9BCB96: rgb(155 203 150), hsl(114 34% 69%), oklch(0.794 0.089 142.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Kettle Drum color name →
#9BCB96
oklch(0.794 0.089 142.3)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A5D0A0
- AFD6AB
- B9DBB5
- C3E0C0
- CDE5CA
- D7EAD5
- E1F0DF
- EBF5EA
- F5FAF4
Odcienie ciemniejsze
- 86B082
- 72966E
- 5E7D5B
- 4B6549
- 394D37
- 283726
- 182216
- 090F08
- 010201
Tony
- 99C394
- 96BC92
- 93B490
- 91AD8E
- 8EA58C
- 8B9E89
- 899687
- 868F85
- 838782
Harmonie kolorów
Komplementarna +180°
- 9BCB96
Kettle Drum
- D8A9DE
≈ Barely Bloomed
Analogowa -30° +30°
- 9BCB96
Kettle Drum
- BDC27E
≈ Pine Glade
- 7CCFB6
≈ Lavish Green
Triada +120° +240°
- 9BCB96
Kettle Drum
- 9DBCF6
≈ Pastel Blue
- F0A5A2
≈ Calabrese
Komplementarna rozszczepiona +150° +210°
- 9BCB96
Kettle Drum
- BDB2F1
≈ Purple Sand
- E9A4C2
≈ Think Pink
Tetrada +90° +180° +270°
- 9BCB96
Kettle Drum
- 7FC6EC
≈ Fish Pond
- D8A9DE
≈ Barely Bloomed
- EAAC86
≈ Coral Dust
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.84:1 · APCA Lc 35
Ag
AAANa czerni
WCAG 11.37:1 · APCA Lc 68
Najlepszy kolor tekstu: #000000
WCAG 11.37:1 (AAA) · APCA Lc 68
Contrast pairs
Fragmenty kodu
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);
}