Nazwany kolor · #9FD9D7
Blue Tint
Blue Tint to #9FD9D7: rgb(159 217 215), hsl(178 43% 74%), oklch(0.845 0.059 193.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Blue Tint color name →
#9FD9D7
oklch(0.845 0.059 193.4)
Konwersje koloru
- HEX
- #9fd9d7
- RGB
- rgb(159 217 215)
- HSL
- hsl(178 43% 74%)
- HWB
- hwb(178 62% 15%)
- OKLCH
- oklch(0.845 0.059 193.4)
- OKLab
- oklab(0.845 -0.058 -0.014)
- CIE Lab
- lab(82.69 -19.54 -5.34)
- LCH
- lch(82.69 20.26 195.3)
- CMYK
- cmyk(27% 0% 1% 15%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- A9DDDB
- B3E1DF
- BDE4E3
- C6E8E7
- D0ECEB
- D9F0EF
- E3F4F3
- ECF7F7
- F6FBFB
Odcienie ciemniejsze
- 8ABCBB
- 75A19F
- 618685
- 4D6C6B
- 3B5352
- 293B3B
- 182525
- 091111
- 010202
Tony
- 9CD0CE
- 9AC7C5
- 97BEBC
- 94B5B3
- 91ACAA
- 8EA3A2
- 8A9A99
- 879191
- 848988
Harmonie kolorów
Komplementarna +180°
- 9FD9D7
Blue Tint
- F0BDC1
≈ Blush Rush
Analogowa -30° +30°
- 9FD9D7
Blue Tint
- A9D9C1
≈ Shanghai Jade
- A2D5E9
≈ Light Budgie Blue
Triada +120° +240°
- 9FD9D7
Blue Tint
- DAC1E8
≈ Glittering Gemstone
- E4C7A2
≈ Egghead
Komplementarna rozszczepiona +150° +210°
- 9FD9D7
Blue Tint
- E9BDD6
≈ Child’s Play
- EFC0AE
≈ Soft Orange
Tetrada +90° +180° +270°
- 9FD9D7
Blue Tint
- C6C8F3
≈ Soap
- F0BDC1
≈ Blush Rush
- D2CFA2
≈ Heart of Palm
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.56:1 · APCA Lc 26
Ag
AAANa czerni
WCAG 13.38:1 · APCA Lc 77
Najlepszy kolor tekstu: #000000
WCAG 13.38:1 (AAA) · APCA Lc 77
Contrast pairs
Fragmenty kodu
CSS
:root {
--blue-tint: #9fd9d7;
--blue-tint-rgb: 159 217 215;
--blue-tint-oklch: oklch(0.845 0.059 193.4);
}
.element {
color: var(--blue-tint);
background-color: hsl(178 43% 74%);
border-color: oklch(0.845 0.059 193.4);
}Tailwind CSS v4
@theme {
--color-blue-tint: #9fd9d7;
--color-blue-tint-50: #e3fbfa;
--color-blue-tint-100: #d2efee;
--color-blue-tint-200: #b8dddc;
--color-blue-tint-300: #94c1c1;
--color-blue-tint-400: #74aaa8;
--color-blue-tint-500: #549391;
--color-blue-tint-600: #487c7b;
--color-blue-tint-700: #396362;
--color-blue-tint-800: #284947;
--color-blue-tint-900: #1b3331;
--color-blue-tint-950: #0b1e1d;
}SCSS
$blue-tint: #9fd9d7;
$blue-tint-rgb: 159, 217, 215;
$blue-tint-light: mix(#fff, $blue-tint, 20%);
$blue-tint-dark: mix(#000, $blue-tint, 20%);
.element {
color: $blue-tint;
box-shadow: 0 0 0 2px rgba($blue-tint, 0.35);
}