Nazwany kolor · #8AF1FE
Shallow Water
Shallow Water to #8AF1FE: rgb(138 241 254), hsl(187 98% 77%), oklch(0.9 0.098 206.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Cyan mean? → · Shallow Water color name →
#8AF1FE
oklch(0.9 0.098 206.1)
Konwersje koloru
- HEX
- #8af1fe
- RGB
- rgb(138 241 254)
- HSL
- hsl(187 98% 77%)
- HWB
- hwb(187 54% 0%)
- OKLCH
- oklch(0.9 0.098 206.1)
- OKLab
- oklab(0.9 -0.088 -0.043)
- CIE Lab
- lab(89.26 -28.9 -16.19)
- LCH
- lch(89.26 33.13 209.3)
- CMYK
- cmyk(46% 5% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 98F3FE
- A5F4FE
- B2F6FF
- BEF7FF
- C9F9FF
- D5FAFF
- E0FBFF
- EAFDFF
- F5FEFF
Odcienie ciemniejsze
- 77D2DD
- 65B3BD
- 53959E
- 427980
- 325D63
- 224347
- 142B2D
- 071416
- 010303
Tony
- 8BE5F1
- 8BDAE4
- 8BCED7
- 8BC3CA
- 8AB7BD
- 89ACB1
- 87A1A4
- 859698
- 838B8C
Harmonie kolorów
Komplementarna +180°
- 8AF1FE
Shallow Water
- FFD2CC
≈ Girlie
Analogowa -30° +30°
- 8AF1FE
Shallow Water
- 94F4DC
≈ Turquoise Pearl
- BBE5FF
≈ Breaking the Ice
Triada +120° +240°
- 8AF1FE
Shallow Water
- FFC9FF
≈ Sugar Chic
- FBDA92
≈ Cooled Cream
Komplementarna rozszczepiona +150° +210°
- 8AF1FE
Shallow Water
- FFCFDF
≈ Bologna Sausage
- FFD4B7
≈ Sensual Peach
Tetrada +90° +180° +270°
- 8AF1FE
Shallow Water
- E1D7FF
≈ Transparent Blue
- FFD2CC
≈ Girlie
- DAE79B
≈ Fresh Frappé
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.30:1 · APCA Lc 15
Ag
AAANa czerni
WCAG 16.09:1 · APCA Lc 89
Najlepszy kolor tekstu: #000000
WCAG 16.09:1 (AAA) · APCA Lc 89
Contrast pairs
Fragmenty kodu
CSS
:root {
--shallow-water: #8af1fe;
--shallow-water-rgb: 138 241 254;
--shallow-water-oklch: oklch(0.9 0.098 206.1);
}
.element {
color: var(--shallow-water);
background-color: hsl(187 98% 77%);
border-color: oklch(0.9 0.098 206.1);
}Tailwind CSS v4
@theme {
--color-shallow-water: #8af1fe;
--color-shallow-water-50: #d6feff;
--color-shallow-water-100: #c3f2f9;
--color-shallow-water-200: #a3e1ea;
--color-shallow-water-300: #78c6d2;
--color-shallow-water-400: #4cafbb;
--color-shallow-water-500: #0098a6;
--color-shallow-water-600: #07818c;
--color-shallow-water-700: #096770;
--color-shallow-water-800: #034c52;
--color-shallow-water-900: #043539;
--color-shallow-water-950: #002023;
}SCSS
$shallow-water: #8af1fe;
$shallow-water-rgb: 138, 241, 254;
$shallow-water-light: mix(#fff, $shallow-water, 20%);
$shallow-water-dark: mix(#000, $shallow-water, 20%);
.element {
color: $shallow-water;
box-shadow: 0 0 0 2px rgba($shallow-water, 0.35);
}