Adlandırılmış renk · #9BAFAD
5-Masted Preußen
5-Masted Preußen, #9BAFAD: rgb(155 175 173), hsl(174 11% 65%), oklch(0.738 0.022 189.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · 5-Masted Preußen color name →
#9BAFAD
oklch(0.738 0.022 189.4)
Renk dönüşümleri
- HEX
- #9bafad
- RGB
- rgb(155 175 173)
- HSL
- hsl(174 11% 65%)
- HWB
- hwb(174 61% 31%)
- OKLCH
- oklch(0.738 0.022 189.4)
- OKLab
- oklab(0.738 -0.022 -0.004)
- CIE Lab
- lab(69.87 -7.49 -1.45)
- LCH
- lch(69.87 7.63 191)
- CMYK
- cmyk(11% 0% 1% 31%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A5B7B5
- AEBFBD
- B8C6C5
- C2CECD
- CCD6D5
- D6DEDD
- E0E6E6
- EAEFEE
- F5F7F7
Koyu tonlar
- 869896
- 72817F
- 5E6B6A
- 4B5655
- 394141
- 282E2D
- 181C1B
- 090B0B
- 010101
Gri tonlar
- 98AAA8
- 96A5A4
- 93A19F
- 909C9B
- 8E9796
- 8B9392
- 888E8D
- 858989
- 838584
Renk uyumları
Tamamlayıcı +180°
- 9BAFAD
5-Masted Preußen
- B8A5A7
≈ Magical Mauve
Analog -30° +30°
- 9BAFAD
5-Masted Preußen
- 9FAFA5
≈ Powdered Gum
- 9BAEB4
≈ Interesting Aqua
Üçlü +120° +240°
- 9BAFAD
5-Masted Preußen
- AEA7B5
≈ Plum Frost
- B4A89B
≈ Nantucket Sands
Bölünmüş tamamlayıcı +150° +210°
- 9BAFAD
5-Masted Preußen
- B4A5AF
≈ Foggy Plum
- B7A6A0
≈ Prestige
Dörtlü +90° +180° +270°
- 9BAFAD
5-Masted Preußen
- A7A9B9
≈ Ridge View
- B8A5A7
≈ Magical Mauve
- ADAB9B
≈ Chatroom
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.30:1 · APCA Lc 45
Ag
AAASiyah üzerinde
WCAG 9.12:1 · APCA Lc 57
En iyi metin rengi: #000000
WCAG 9.12:1 (AAA) · APCA Lc 57
Contrast pairs
Kod parçacıkları
CSS
:root {
--color-5-masted-preu-en: #9bafad;
--color-5-masted-preu-en-rgb: 155 175 173;
--color-5-masted-preu-en-oklch: oklch(0.738 0.022 189.4);
}
.element {
color: var(--color-5-masted-preu-en);
background-color: hsl(174 11% 65%);
border-color: oklch(0.738 0.022 189.4);
}Tailwind CSS v4
@theme {
--color-color-5-masted-preu-en: #9bafad;
--color-color-5-masted-preu-en-50: #eef7f7;
--color-color-5-masted-preu-en-100: #e0eaea;
--color-color-5-masted-preu-en-200: #cad7d6;
--color-color-5-masted-preu-en-300: #abbbba;
--color-color-5-masted-preu-en-400: #90a3a1;
--color-color-5-masted-preu-en-500: #768b89;
--color-color-5-masted-preu-en-600: #647674;
--color-color-5-masted-preu-en-700: #505e5d;
--color-color-5-masted-preu-en-800: #3a4544;
--color-color-5-masted-preu-en-900: #28302f;
--color-color-5-masted-preu-en-950: #161c1b;
}SCSS
$color-5-masted-preu-en: #9bafad;
$color-5-masted-preu-en-rgb: 155, 175, 173;
$color-5-masted-preu-en-light: mix(#fff, $color-5-masted-preu-en, 20%);
$color-5-masted-preu-en-dark: mix(#000, $color-5-masted-preu-en, 20%);
.element {
color: $color-5-masted-preu-en;
box-shadow: 0 0 0 2px rgba($color-5-masted-preu-en, 0.35);
}