Adlandırılmış renk · #81B39C
Mid-century Gem
Mid-century Gem, #81B39C: rgb(129 179 156), hsl(152 25% 60%), oklch(0.725 0.063 164.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Green mean? → · Mid-century Gem color name →
#81B39C
oklch(0.725 0.063 164.6)
Renk dönüşümleri
- HEX
- #81b39c
- RGB
- rgb(129 179 156)
- HSL
- hsl(152 25% 60%)
- HWB
- hwb(152 51% 30%)
- OKLCH
- oklch(0.725 0.063 164.6)
- OKLab
- oklab(0.725 -0.061 0.017)
- CIE Lab
- lab(68.91 -20.93 6.19)
- LCH
- lch(68.91 21.83 163.5)
- CMYK
- cmyk(28% 0% 13% 30%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 8EBAA6
- 9AC2AF
- A7CAB9
- B3D1C3
- C0D9CC
- CCE0D6
- D9E8E0
- E6F0EB
- F2F7F5
Koyu tonlar
- 6F9B87
- 5E8473
- 4E6E5F
- 3E584C
- 2E4339
- 1F2F28
- 121D18
- 060C09
- 010101
Gri tonlar
- 81AE99
- 82A996
- 82A494
- 829E91
- 82998E
- 82948B
- 818F88
- 818A86
- 818583
Renk uyumları
Tamamlayıcı +180°
- 81B39C
Mid-century Gem
- C497AF
≈ Lady’s Cushions Pink
Analog -30° +30°
- 81B39C
Mid-century Gem
- 96AF88
≈ Fair Green
- 76B3B2
≈ Aurora Teal
Üçlü +120° +240°
- 81B39C
Mid-century Gem
- A1A1CD
≈ Indigo Child
- C89A86
≈ Calliope
Bölünmüş tamamlayıcı +150° +210°
- 81B39C
Mid-century Gem
- B59BC2
≈ Crocus Petal
- CA969A
≈ Minstrel Rose
Dörtlü +90° +180° +270°
- 81B39C
Mid-century Gem
- 8CA9CD
≈ Polo Blue
- C497AF
≈ Lady’s Cushions Pink
- BEA17A
≈ Season Finale
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.36:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.86:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.86:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--mid-century-gem: #81b39c;
--mid-century-gem-rgb: 129 179 156;
--mid-century-gem-oklch: oklch(0.725 0.063 164.6);
}
.element {
color: var(--mid-century-gem);
background-color: hsl(152 25% 60%);
border-color: oklch(0.725 0.063 164.6);
}Tailwind CSS v4
@theme {
--color-mid-century-gem: #81b39c;
--color-mid-century-gem-50: #e5fbf1;
--color-mid-century-gem-100: #d5efe3;
--color-mid-century-gem-200: #bcddce;
--color-mid-century-gem-300: #99c2b0;
--color-mid-century-gem-400: #7cab95;
--color-mid-century-gem-500: #5d947b;
--color-mid-century-gem-600: #4f7d69;
--color-mid-century-gem-700: #3f6454;
--color-mid-century-gem-800: #2e493c;
--color-mid-century-gem-900: #1f3329;
--color-mid-century-gem-950: #0e1f17;
}SCSS
$mid-century-gem: #81b39c;
$mid-century-gem-rgb: 129, 179, 156;
$mid-century-gem-light: mix(#fff, $mid-century-gem, 20%);
$mid-century-gem-dark: mix(#000, $mid-century-gem, 20%);
.element {
color: $mid-century-gem;
box-shadow: 0 0 0 2px rgba($mid-century-gem, 0.35);
}