Adlandırılmış renk · #38887F
Copper Turquoise
Copper Turquoise, #38887F: rgb(56 136 127), hsl(173 42% 38%), oklch(0.575 0.079 185.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Copper Turquoise color name →
#38887F
oklch(0.575 0.079 185.2)
Renk dönüşümleri
- HEX
- #38887f
- RGB
- rgb(56 136 127)
- HSL
- hsl(173 42% 38%)
- HWB
- hwb(173 22% 47%)
- OKLCH
- oklch(0.575 0.079 185.2)
- OKLab
- oklab(0.575 -0.079 -0.007)
- CIE Lab
- lab(51.63 -27.2 -2.9)
- LCH
- lch(51.63 27.35 186.1)
- CMYK
- cmyk(59% 0% 7% 47%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 4F948B
- 649F97
- 78ABA4
- 8BB7B0
- 9EC2BD
- B1CECA
- C5DAD7
- D8E7E4
- EBF3F2
Koyu tonlar
- 2F756E
- 27635D
- 1F524C
- 17413C
- 0F312D
- 08221F
- 041311
- 010606
- 000101
Gri tonlar
- 42877F
- 4C877F
- 54867F
- 5B857F
- 628480
- 698480
- 6F8380
- 758280
- 7A8180
Renk uyumları
Tamamlayıcı +180°
- 38887F
Copper Turquoise
- A16572
≈ Matte Carmine
Analog -30° +30°
- 38887F
Copper Turquoise
- 508764
≈ Mallard Green
- 388596
≈ Precious Stone
Üçlü +120° +240°
- 38887F
Copper Turquoise
- 846D9E
≈ Bitter Violet
- 996F45
≈ Chewy Caramel
Bölünmüş tamamlayıcı +150° +210°
- 38887F
Copper Turquoise
- 96678B
≈ Chinese Violet
- A26859
≈ Sun Baked Earth
Dörtlü +90° +180° +270°
- 38887F
Copper Turquoise
- 6B75A8
≈ Midnight Violet
- A16572
≈ Matte Carmine
- 87783F
≈ Bay Leaf
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 4.20:1 · APCA Lc 69
Ag
AASiyah üzerinde
WCAG 4.99:1 · APCA Lc 33
En iyi metin rengi: #000000
WCAG 4.99:1 (AA) · APCA Lc 33
Contrast pairs
Kod parçacıkları
CSS
:root {
--copper-turquoise: #38887f;
--copper-turquoise-rgb: 56 136 127;
--copper-turquoise-oklch: oklch(0.575 0.079 185.2);
}
.element {
color: var(--copper-turquoise);
background-color: hsl(173 42% 38%);
border-color: oklch(0.575 0.079 185.2);
}Tailwind CSS v4
@theme {
--color-copper-turquoise: #38887f;
--color-copper-turquoise-50: #ddfdf9;
--color-copper-turquoise-100: #cbf1ec;
--color-copper-turquoise-200: #afe0da;
--color-copper-turquoise-300: #88c5be;
--color-copper-turquoise-400: #65aea5;
--color-copper-turquoise-500: #3d978d;
--color-copper-turquoise-600: #358077;
--color-copper-turquoise-700: #2a6660;
--color-copper-turquoise-800: #1d4b45;
--color-copper-turquoise-900: #133430;
--color-copper-turquoise-950: #05201c;
}SCSS
$copper-turquoise: #38887f;
$copper-turquoise-rgb: 56, 136, 127;
$copper-turquoise-light: mix(#fff, $copper-turquoise, 20%);
$copper-turquoise-dark: mix(#000, $copper-turquoise, 20%);
.element {
color: $copper-turquoise;
box-shadow: 0 0 0 2px rgba($copper-turquoise, 0.35);
}