Adlandırılmış renk · #A1F4F5
Hydro Cannon
Hydro Cannon, #A1F4F5: rgb(161 244 245), hsl(181 81% 80%), oklch(0.915 0.081 196.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Hydro Cannon color name →
#A1F4F5
oklch(0.915 0.081 196.8)
Renk dönüşümleri
- HEX
- #a1f4f5
- RGB
- rgb(161 244 245)
- HSL
- hsl(181 81% 80%)
- HWB
- hwb(181 63% 4%)
- OKLCH
- oklch(0.915 0.081 196.8)
- OKLab
- oklab(0.915 -0.077 -0.023)
- CIE Lab
- lab(90.93 -26 -8.94)
- LCH
- lch(90.93 27.49 199)
- CMYK
- cmyk(34% 0% 0% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- ACF5F6
- B6F6F7
- C0F8F8
- C9F9F9
- D3FAFA
- DCFBFB
- E5FCFC
- EEFDFD
- F6FEFE
Koyu tonlar
- 8BD4D5
- 76B5B6
- 629798
- 4E7A7B
- 3C5E5F
- 2A4444
- 192B2B
- 091415
- 010303
Gri tonlar
- 9FE8E9
- 9CDCDD
- 99D0D1
- 96C4C5
- 93B9B9
- 90ADAD
- 8CA2A2
- 889696
- 848B8B
Renk uyumları
Tamamlayıcı +180°
- A1F4F5
Hydro Cannon
- FFD8D8
≈ We Peep
Analog -30° +30°
- A1F4F5
Hydro Cannon
- AFF5D7
≈ Mintie
- BEEBFF
≈ Blue Java Banana
Üçlü +120° +240°
- A1F4F5
Hydro Cannon
- F4D7FF
≈ Lavender Savour
- FFDDAC
≈ Navajo White
Bölünmüş tamamlayıcı +150° +210°
- A1F4F5
Hydro Cannon
- FFD5EA
≈ Pink Currant
- FFDAC8
≈ Camisole
Dörtlü +90° +180° +270°
- A1F4F5
Hydro Cannon
- E0DFFF
≈ Stoic White
- FFD8D8
≈ We Peep
- E9E7A9
≈ Kiwi Ice Cream
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.25:1 · APCA Lc 12
Ag
AAASiyah üzerinde
WCAG 16.77:1 · APCA Lc 92
En iyi metin rengi: #000000
WCAG 16.77:1 (AAA) · APCA Lc 92
Contrast pairs
Kod parçacıkları
CSS
:root {
--hydro-cannon: #a1f4f5;
--hydro-cannon-rgb: 161 244 245;
--hydro-cannon-oklch: oklch(0.915 0.081 196.8);
}
.element {
color: var(--hydro-cannon);
background-color: hsl(181 81% 80%);
border-color: oklch(0.915 0.081 196.8);
}Tailwind CSS v4
@theme {
--color-hydro-cannon: #a1f4f5;
--color-hydro-cannon-50: #dcfdfe;
--color-hydro-cannon-100: #caf1f2;
--color-hydro-cannon-200: #acdfe1;
--color-hydro-cannon-300: #85c4c7;
--color-hydro-cannon-400: #60adaf;
--color-hydro-cannon-500: #359798;
--color-hydro-cannon-600: #2f7f81;
--color-hydro-cannon-700: #266667;
--color-hydro-cannon-800: #194b4b;
--color-hydro-cannon-900: #113434;
--color-hydro-cannon-950: #031f1f;
}SCSS
$hydro-cannon: #a1f4f5;
$hydro-cannon-rgb: 161, 244, 245;
$hydro-cannon-light: mix(#fff, $hydro-cannon, 20%);
$hydro-cannon-dark: mix(#000, $hydro-cannon, 20%);
.element {
color: $hydro-cannon;
box-shadow: 0 0 0 2px rgba($hydro-cannon, 0.35);
}