Adlandırılmış renk · #9EB4C0
Faded Flaxflower
Faded Flaxflower, #9EB4C0: rgb(158 180 192), hsl(201 21% 69%), oklch(0.757 0.03 231.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Faded Flaxflower color name →
#9EB4C0
oklch(0.757 0.03 231.6)
Renk dönüşümleri
- HEX
- #9eb4c0
- RGB
- rgb(158 180 192)
- HSL
- hsl(201 21% 69%)
- HWB
- hwb(201 62% 25%)
- OKLCH
- oklch(0.757 0.03 231.6)
- OKLab
- oklab(0.757 -0.019 -0.023)
- CIE Lab
- lab(71.91 -5.92 -8.82)
- LCH
- lch(71.91 10.62 236.1)
- CMYK
- cmyk(18% 6% 0% 25%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A7BBC6
- B1C3CC
- BACAD3
- C4D1D9
- CED9DF
- D7E0E5
- E1E8EC
- EBF0F2
- F5F7F9
Koyu tonlar
- 899CA7
- 74858E
- 606E76
- 4D585F
- 3A4449
- 293034
- 181D20
- 090C0E
- 010202
Gri tonlar
- 9BAFB9
- 98A9B3
- 95A4AC
- 929FA6
- 8F9A9F
- 8C9499
- 898F93
- 868A8C
- 838586
Renk uyumları
Tamamlayıcı +180°
- 9EB4C0
Faded Flaxflower
- C0AB9F
≈ Bamboo Beige
Analog -30° +30°
- 9EB4C0
Faded Flaxflower
- 9BB6B8
≈ Windswept Clouds
- A6B1C4
≈ Innuendo
Üçlü +120° +240°
- 9EB4C0
Faded Flaxflower
- C0A9B2
≈ Violet Ice
- B0B29D
≈ Ballie Scott Sage
Bölünmüş tamamlayıcı +150° +210°
- 9EB4C0
Faded Flaxflower
- C3A9A8
≈ Dusky
- BAAF9B
≈ Townhouse Taupe
Dörtlü +90° +180° +270°
- 9EB4C0
Faded Flaxflower
- B9AABC
≈ Lola
- C0AB9F
≈ Bamboo Beige
- A6B5A4
≈ Thrush Egg
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.15:1 · APCA Lc 42
Ag
AAASiyah üzerinde
WCAG 9.74:1 · APCA Lc 60
En iyi metin rengi: #000000
WCAG 9.74:1 (AAA) · APCA Lc 60
Contrast pairs
Kod parçacıkları
CSS
:root {
--faded-flaxflower: #9eb4c0;
--faded-flaxflower-rgb: 158 180 192;
--faded-flaxflower-oklch: oklch(0.757 0.03 231.6);
}
.element {
color: var(--faded-flaxflower);
background-color: hsl(201 21% 69%);
border-color: oklch(0.757 0.03 231.6);
}Tailwind CSS v4
@theme {
--color-faded-flaxflower: #9eb4c0;
--color-faded-flaxflower-50: #edf7fc;
--color-faded-flaxflower-100: #dfeaf0;
--color-faded-flaxflower-200: #c8d7df;
--color-faded-flaxflower-300: #a9bac4;
--color-faded-flaxflower-400: #8da2ad;
--color-faded-flaxflower-500: #738a97;
--color-faded-flaxflower-600: #61757f;
--color-faded-flaxflower-700: #4e5e66;
--color-faded-flaxflower-800: #38454b;
--color-faded-flaxflower-900: #262f34;
--color-faded-flaxflower-950: #151c1f;
}SCSS
$faded-flaxflower: #9eb4c0;
$faded-flaxflower-rgb: 158, 180, 192;
$faded-flaxflower-light: mix(#fff, $faded-flaxflower, 20%);
$faded-flaxflower-dark: mix(#000, $faded-flaxflower, 20%);
.element {
color: $faded-flaxflower;
box-shadow: 0 0 0 2px rgba($faded-flaxflower, 0.35);
}