Nazwany kolor · #54AF9C
Water Park
Water Park to #54AF9C: rgb(84 175 156), hsl(167 36% 51%), oklch(0.693 0.092 177.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Water Park color name →
#54AF9C
oklch(0.693 0.092 177.9)
Konwersje koloru
- HEX
- #54af9c
- RGB
- rgb(84 175 156)
- HSL
- hsl(167 36% 51%)
- HWB
- hwb(167 33% 31%)
- OKLCH
- oklch(0.693 0.092 177.9)
- OKLab
- oklab(0.693 -0.092 0.003)
- CIE Lab
- lab(65.53 -32.03 1.03)
- LCH
- lch(65.53 32.05 178.2)
- CMYK
- cmyk(52% 0% 11% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 68B7A5
- 7ABFAF
- 8CC7B9
- 9DCFC3
- ADD7CC
- BEDFD6
- CEE7E0
- DEEFEB
- EFF7F5
Odcienie ciemniejsze
- 489887
- 3C8173
- 316B5F
- 26564C
- 1B4139
- 112E28
- 081C18
- 020B09
- 000101
Tony
- 5BAA99
- 61A696
- 67A193
- 6C9C91
- 70988E
- 74938B
- 778E88
- 7B8A86
- 7D8583
Harmonie kolorów
Komplementarna +180°
- 54AF9C
Water Park
- CB849C
≈ Cashmere Rose
Analogowa -30° +30°
- 54AF9C
Water Park
- 74AC7C
≈ Abomination
- 4BACBA
≈ Verditer Blue
Triada +120° +240°
- 54AF9C
Water Park
- A390CE
≈ Distinct Purple
- C78E62
≈ Butterum
Komplementarna rozszczepiona +150° +210°
- 54AF9C
Water Park
- BB88B9
≈ Violet Tulle
- CF867C
≈ Ginger Whisper
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.62:1 · APCA Lc 51
Ag
AAANa czerni
WCAG 7.98:1 · APCA Lc 51
Najlepszy kolor tekstu: #000000
WCAG 7.98:1 (AAA) · APCA Lc 51
Contrast pairs
Fragmenty kodu
CSS
:root {
--water-park: #54af9c;
--water-park-rgb: 84 175 156;
--water-park-oklch: oklch(0.693 0.092 177.9);
}
.element {
color: var(--water-park);
background-color: hsl(167 36% 51%);
border-color: oklch(0.693 0.092 177.9);
}Tailwind CSS v4
@theme {
--color-water-park: #54af9c;
--color-water-park-50: #dafef6;
--color-water-park-100: #c8f3e9;
--color-water-park-200: #aae2d6;
--color-water-park-300: #81c7b9;
--color-water-park-400: #5cb09e;
--color-water-park-500: #2c9a86;
--color-water-park-600: #288271;
--color-water-park-700: #20685b;
--color-water-park-800: #164d41;
--color-water-park-900: #0f352d;
--color-water-park-950: #02201a;
}SCSS
$water-park: #54af9c;
$water-park-rgb: 84, 175, 156;
$water-park-light: mix(#fff, $water-park, 20%);
$water-park-dark: mix(#000, $water-park, 20%);
.element {
color: $water-park;
box-shadow: 0 0 0 2px rgba($water-park, 0.35);
}