Nazwany kolor · #38887F
Copper Turquoise
Copper Turquoise to #38887F: rgb(56 136 127), hsl(173 42% 38%), oklch(0.575 0.079 185.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Copper Turquoise color name →
#38887F
oklch(0.575 0.079 185.2)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 4F948B
- 649F97
- 78ABA4
- 8BB7B0
- 9EC2BD
- B1CECA
- C5DAD7
- D8E7E4
- EBF3F2
Odcienie ciemniejsze
- 2F756E
- 27635D
- 1F524C
- 17413C
- 0F312D
- 08221F
- 041311
- 010606
- 000101
Tony
- 42877F
- 4C877F
- 54867F
- 5B857F
- 628480
- 698480
- 6F8380
- 758280
- 7A8180
Harmonie kolorów
Komplementarna +180°
- 38887F
Copper Turquoise
- A16572
≈ Matte Carmine
Analogowa -30° +30°
- 38887F
Copper Turquoise
- 508764
≈ Mallard Green
- 388596
≈ Precious Stone
Triada +120° +240°
- 38887F
Copper Turquoise
- 846D9E
≈ Bitter Violet
- 996F45
≈ Chewy Caramel
Komplementarna rozszczepiona +150° +210°
- 38887F
Copper Turquoise
- 96678B
≈ Chinese Violet
- A26859
≈ Sun Baked Earth
Tetrada +90° +180° +270°
- 38887F
Copper Turquoise
- 6B75A8
≈ Midnight Violet
- A16572
≈ Matte Carmine
- 87783F
≈ Bay Leaf
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.20:1 · APCA Lc 69
Ag
AANa czerni
WCAG 4.99:1 · APCA Lc 33
Najlepszy kolor tekstu: #000000
WCAG 4.99:1 (AA) · APCA Lc 33
Contrast pairs
Fragmenty kodu
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);
}