Adlandırılmış renk · #B4C8C2
Surf Spray
Surf Spray, #B4C8C2: rgb(180 200 194), hsl(162 15% 75%), oklch(0.816 0.023 175.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Surf Spray color name →
#B4C8C2
oklch(0.816 0.023 175.8)
Renk dönüşümleri
- HEX
- #b4c8c2
- RGB
- rgb(180 200 194)
- HSL
- hsl(162 15% 75%)
- HWB
- hwb(162 71% 22%)
- OKLCH
- oklch(0.816 0.023 175.8)
- OKLab
- oklab(0.816 -0.023 0.002)
- CIE Lab
- lab(78.94 -7.91 0.57)
- LCH
- lch(78.94 7.93 175.8)
- CMYK
- cmyk(10% 0% 3% 22%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BBCDC8
- C3D3CE
- CAD8D4
- D2DEDA
- D9E3E0
- E1E9E6
- E8EEEC
- F0F4F3
- F7F9F9
Koyu tonlar
- 9CAEA8
- 85948F
- 6E7B77
- 586360
- 444C49
- 303634
- 1D2120
- 0C0F0E
- 020202
Gri tonlar
- AFC1BB
- A9B9B4
- A4B2AE
- 9FABA7
- 9AA3A0
- 959C9A
- 8F9593
- 8A8E8D
- 858786
Renk uyumları
Tamamlayıcı +180°
- B4C8C2
Surf Spray
- D0BDC3
≈ Pink Linen
Analog -30° +30°
- B4C8C2
Surf Spray
- BAC7BA
≈ Tree Pose
- B2C7CA
≈ Restful Retreat
Üçlü +120° +240°
- B4C8C2
Surf Spray
- C4C0D1
≈ Estate Violet
- CFBFB5
≈ Summer Bloom
Bölünmüş tamamlayıcı +150° +210°
- B4C8C2
Surf Spray
- CBBECB
≈ Puffball
- D2BDBB
≈ Moth Pink
Dörtlü +90° +180° +270°
- B4C8C2
Surf Spray
- BCC3D2
≈ Blue Bayou
- D0BDC3
≈ Pink Linen
- C9C2B2
≈ Oatmeal
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.75:1 · APCA Lc 32
Ag
AAASiyah üzerinde
WCAG 11.98:1 · APCA Lc 71
En iyi metin rengi: #000000
WCAG 11.98:1 (AAA) · APCA Lc 71
Contrast pairs
Kod parçacıkları
CSS
:root {
--surf-spray: #b4c8c2;
--surf-spray-rgb: 180 200 194;
--surf-spray-oklch: oklch(0.816 0.023 175.8);
}
.element {
color: var(--surf-spray);
background-color: hsl(162 15% 75%);
border-color: oklch(0.816 0.023 175.8);
}Tailwind CSS v4
@theme {
--color-surf-spray: #b4c8c2;
--color-surf-spray-50: #eff7f5;
--color-surf-spray-100: #e0ebe8;
--color-surf-spray-200: #cad8d4;
--color-surf-spray-300: #acbbb7;
--color-surf-spray-400: #91a39e;
--color-surf-spray-500: #778b85;
--color-surf-spray-600: #657671;
--color-surf-spray-700: #505e5a;
--color-surf-spray-800: #3a4542;
--color-surf-spray-900: #28302d;
--color-surf-spray-950: #161c1a;
}SCSS
$surf-spray: #b4c8c2;
$surf-spray-rgb: 180, 200, 194;
$surf-spray-light: mix(#fff, $surf-spray, 20%);
$surf-spray-dark: mix(#000, $surf-spray, 20%);
.element {
color: $surf-spray;
box-shadow: 0 0 0 2px rgba($surf-spray, 0.35);
}