En yakın adlandırılmış renk · #3FAE75
#3FAE75
En yakın adlandırılmış renk: Jubilant Jade
#3FAE75 (rgb(63 174 117), hsl(149 47% 46%), oklch(0.673 0.132 157.3)) en çok Jubilant Jade adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#3FAE75
oklch(0.673 0.132 157.3)
Renk dönüşümleri
- HEX
- #3fae75
- RGB
- rgb(63 174 117)
- HSL
- hsl(149 47% 46%)
- HWB
- hwb(149 25% 32%)
- OKLCH
- oklch(0.673 0.132 157.3)
- OKLab
- oklab(0.673 -0.122 0.051)
- CIE Lab
- lab(63.78 -42.97 19.7)
- LCH
- lch(63.78 47.27 155.4)
- CMYK
- cmyk(64% 0% 33% 32%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 58B682
- 6DBF90
- 81C79D
- 94CFAB
- A6D7B9
- B8DFC6
- CAE7D4
- DCEFE2
- EDF7F1
Koyu tonlar
- 359765
- 2C8055
- 236A46
- 1B5537
- 124129
- 0A2E1C
- 041C0F
- 010B05
- 000101
Gri tonlar
- 4AAA76
- 54A578
- 5CA179
- 639C7A
- 69987B
- 6E937C
- 738E7D
- 788A7E
- 7C857F
Renk uyumları
Tamamlayıcı +180°
- 3FAE75
Jubilant Jade
- C974B3
≈ Sky Magenta
Analog -30° +30°
- 3FAE75
Jubilant Jade
- 80A544
≈ Greenery
- 00ADA2
≈ Cozumel
Üçlü +120° +240°
- 3FAE75
Jubilant Jade
- 838DE6
≈ Perrywinkle
- DA7659
≈ Peachy Scene
Bölünmüş tamamlayıcı +150° +210°
- 3FAE75
Jubilant Jade
- AC7FD5
≈ Lavender Blossom
- D97188
≈ Strawberry Milkshake
Dörtlü +90° +180° +270°
- 3FAE75
Jubilant Jade
- 4A9CE3
≈ Perfect Days
- C974B3
≈ Sky Magenta
- CB842B
≈ Harvest at Dusk
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.79:1 · APCA Lc 53
Ag
AAASiyah üzerinde
WCAG 7.52:1 · APCA Lc 48
En iyi metin rengi: #000000
WCAG 7.52:1 (AAA) · APCA Lc 48
Contrast pairs
Kod parçacıkları
CSS
:root {
--jubilant-jade: #3fae75;
--jubilant-jade-rgb: 63 174 117;
--jubilant-jade-oklch: oklch(0.673 0.132 157.3);
}
.element {
color: var(--jubilant-jade);
background-color: hsl(149 47% 46%);
border-color: oklch(0.673 0.132 157.3);
}Tailwind CSS v4
@theme {
--color-jubilant-jade: #3fae75;
--color-jubilant-jade-50: #d6ffe8;
--color-jubilant-jade-100: #c3f6d8;
--color-jubilant-jade-200: #a3e6c0;
--color-jubilant-jade-300: #78cc9f;
--color-jubilant-jade-400: #50b67f;
--color-jubilant-jade-500: #089f62;
--color-jubilant-jade-600: #118753;
--color-jubilant-jade-700: #106c42;
--color-jubilant-jade-800: #0e4f2e;
--color-jubilant-jade-900: #09371f;
--color-jubilant-jade-950: #00220e;
}SCSS
$jubilant-jade: #3fae75;
$jubilant-jade-rgb: 63, 174, 117;
$jubilant-jade-light: mix(#fff, $jubilant-jade, 20%);
$jubilant-jade-dark: mix(#000, $jubilant-jade, 20%);
.element {
color: $jubilant-jade;
box-shadow: 0 0 0 2px rgba($jubilant-jade, 0.35);
}