Adlandırılmış renk · #C6A0AB
Opaline Pink
Opaline Pink, #C6A0AB: rgb(198 160 171), hsl(343 25% 70%), oklch(0.743 0.047 359.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Opaline Pink color name →
#C6A0AB
oklch(0.743 0.047 359.1)
Renk dönüşümleri
- HEX
- #c6a0ab
- RGB
- rgb(198 160 171)
- HSL
- hsl(343 25% 70%)
- HWB
- hwb(343 63% 22%)
- OKLCH
- oklch(0.743 0.047 359.1)
- OKLab
- oklab(0.743 0.047 -0.001)
- CIE Lab
- lab(69.64 15.79 -0.12)
- LCH
- lch(69.64 15.79 359.6)
- CMYK
- cmyk(0% 19% 14% 22%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CCA9B3
- D2B2BB
- D7BCC4
- DDC5CC
- E3CFD4
- E9D8DD
- EEE2E5
- F4EBEE
- F9F5F6
Koyu tonlar
- AC8B94
- 92767E
- 7A6168
- 624E54
- 4B3B40
- 35292D
- 21191B
- 0E090B
- 020101
Gri tonlar
- BF9DA7
- B89AA2
- B1969E
- AA939A
- A39095
- 9C8D91
- 958A8D
- 8E8688
- 878384
Renk uyumları
Tamamlayıcı +180°
- C6A0AB
Opaline Pink
- 8CB6AC
≈ Treetop
Analog -30° +30°
- C6A0AB
Opaline Pink
- BDA2BB
≈ Leek Blossom Pink
- C8A19B
≈ Aged Pink
Üçlü +120° +240°
- C6A0AB
Opaline Pink
- A8B18F
≈ Family Tree
- 91B1C7
≈ Porcelain Vase
Bölünmüş tamamlayıcı +150° +210°
- C6A0AB
Opaline Pink
- 98B59C
≈ Garden District
- 8AB5BC
≈ Kitchen Blue
Dörtlü +90° +180° +270°
- C6A0AB
Opaline Pink
- B8AB8A
≈ Bayberry Wax
- 8CB6AC
≈ Treetop
- A0ABCB
≈ Lilac Scent Soft Blue
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.32:1 · APCA Lc 46
Ag
AAASiyah üzerinde
WCAG 9.01:1 · APCA Lc 56
En iyi metin rengi: #000000
WCAG 9.01:1 (AAA) · APCA Lc 56
Contrast pairs
Kod parçacıkları
CSS
:root {
--opaline-pink: #c6a0ab;
--opaline-pink-rgb: 198 160 171;
--opaline-pink-oklch: oklch(0.743 0.047 359.1);
}
.element {
color: var(--opaline-pink);
background-color: hsl(343 25% 70%);
border-color: oklch(0.743 0.047 359.1);
}Tailwind CSS v4
@theme {
--color-opaline-pink: #c6a0ab;
--color-opaline-pink-50: #fff0f4;
--color-opaline-pink-100: #f6e2e7;
--color-opaline-pink-200: #e7ccd3;
--color-opaline-pink-300: #cdaeb6;
--color-opaline-pink-400: #b7939e;
--color-opaline-pink-500: #a17985;
--color-opaline-pink-600: #886771;
--color-opaline-pink-700: #6d525a;
--color-opaline-pink-800: #503c42;
--color-opaline-pink-900: #38292e;
--color-opaline-pink-950: #22171b;
}SCSS
$opaline-pink: #c6a0ab;
$opaline-pink-rgb: 198, 160, 171;
$opaline-pink-light: mix(#fff, $opaline-pink, 20%);
$opaline-pink-dark: mix(#000, $opaline-pink, 20%);
.element {
color: $opaline-pink;
box-shadow: 0 0 0 2px rgba($opaline-pink, 0.35);
}