Najbliższy nazwany kolor · #47D7B5
#47D7B5
Najbliższy nazwany kolor: Mermaid’s Kiss
#47D7B5 (rgb(71 215 181), hsl(166 64% 56%), oklch(0.794 0.131 173.8)) jest najbliższy nazwanemu kolorowi Mermaid’s Kiss. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#47D7B5
oklch(0.794 0.131 173.8)
Konwersje koloru
- HEX
- #47d7b5
- RGB
- rgb(71 215 181)
- HSL
- hsl(166 64% 56%)
- HWB
- hwb(166 28% 16%)
- OKLCH
- oklch(0.794 0.131 173.8)
- OKLab
- oklab(0.794 -0.131 0.014)
- CIE Lab
- lab(77.83 -45.97 5.07)
- LCH
- lch(77.83 46.25 173.7)
- CMYK
- cmyk(67% 0% 16% 16%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 63DBBC
- 79E0C3
- 8DE4CB
- 9FE8D2
- B0ECD9
- C1F0E1
- D1F4E8
- E0F8F0
- F0FBF7
Odcienie ciemniejsze
- 3DBB9D
- 329F86
- 28856F
- 1F6B59
- 165244
- 0D3B30
- 06251D
- 02110C
- 000202
Tony
- 54CEB0
- 5EC5AA
- 66BDA5
- 6CB49F
- 71AB9A
- 76A395
- 799A90
- 7C918A
- 7E8985
Harmonie kolorów
Komplementarna +180°
- 47D7B5
Mermaid’s Kiss
- FD97C2
≈ Himalayan Balsam
Analogowa -30° +30°
- 47D7B5
Mermaid’s Kiss
- 86D284
≈ Electric Lettuce
- 1FD4E2
≈ Aztec Turquoise
Triada +120° +240°
- 47D7B5
Mermaid’s Kiss
- BFADFF
≈ Winterspring Lilac
- FDA367
≈ Baby Melon
Komplementarna rozszczepiona +150° +210°
- 47D7B5
Mermaid’s Kiss
- E59EEC
≈ VIC 20 Pink
- FF9D97
≈ Peach Amber
Tetrada +90° +180° +270°
- 47D7B5
Mermaid’s Kiss
- 9ABBFF
≈ Truesky Gloxym
- FD97C2
≈ Himalayan Balsam
- E4B44D
≈ Va Va Voom
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.80:1 · APCA Lc 33
Ag
AAANa czerni
WCAG 11.65:1 · APCA Lc 70
Najlepszy kolor tekstu: #000000
WCAG 11.65:1 (AAA) · APCA Lc 70
Contrast pairs
Fragmenty kodu
CSS
:root {
--mermaid-s-kiss: #47d7b5;
--mermaid-s-kiss-rgb: 71 215 181;
--mermaid-s-kiss-oklch: oklch(0.794 0.131 173.8);
}
.element {
color: var(--mermaid-s-kiss);
background-color: hsl(166 64% 56%);
border-color: oklch(0.794 0.131 173.8);
}Tailwind CSS v4
@theme {
--color-mermaid-s-kiss: #47d7b5;
--color-mermaid-s-kiss-50: #cffff3;
--color-mermaid-s-kiss-100: #baf7e6;
--color-mermaid-s-kiss-200: #96e7d2;
--color-mermaid-s-kiss-300: #64cdb4;
--color-mermaid-s-kiss-400: #28b798;
--color-mermaid-s-kiss-500: #00a17f;
--color-mermaid-s-kiss-600: #00886c;
--color-mermaid-s-kiss-700: #006d56;
--color-mermaid-s-kiss-800: #00503d;
--color-mermaid-s-kiss-900: #00382a;
--color-mermaid-s-kiss-950: #002217;
}SCSS
$mermaid-s-kiss: #47d7b5;
$mermaid-s-kiss-rgb: 71, 215, 181;
$mermaid-s-kiss-light: mix(#fff, $mermaid-s-kiss, 20%);
$mermaid-s-kiss-dark: mix(#000, $mermaid-s-kiss, 20%);
.element {
color: $mermaid-s-kiss;
box-shadow: 0 0 0 2px rgba($mermaid-s-kiss, 0.35);
}