Nazwany kolor · #77CCBB
Jolly Jade
Jolly Jade to #77CCBB: rgb(119 204 187), hsl(168 45% 63%), oklch(0.786 0.087 179.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Jolly Jade color name →
#77CCBB
oklch(0.786 0.087 179.6)
Konwersje koloru
- HEX
- #77ccbb
- RGB
- rgb(119 204 187)
- HSL
- hsl(168 45% 63%)
- HWB
- hwb(168 47% 20%)
- OKLCH
- oklch(0.786 0.087 179.6)
- OKLab
- oklab(0.786 -0.087 0.001)
- CIE Lab
- lab(76.32 -30.03 -0.02)
- LCH
- lch(76.32 30.03 180)
- CMYK
- cmyk(42% 0% 8% 20%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 86D1C2
- 95D6C8
- A3DCCF
- B0E1D6
- BEE6DD
- CBEBE3
- D8F0EA
- E5F5F1
- F2FAF8
Odcienie ciemniejsze
- 67B1A2
- 57978A
- 477E73
- 38655C
- 2A4E46
- 1C3732
- 10221F
- 050F0D
- 010202
Tony
- 7AC4B5
- 7CBDAF
- 7DB5A9
- 7FADA3
- 7FA69D
- 809E97
- 819691
- 818F8B
- 808786
Harmonie kolorów
Komplementarna +180°
- 77CCBB
Jolly Jade
- E8A2B7
≈ Rose Elegance
Analogowa -30° +30°
- 77CCBB
Jolly Jade
- 92C99C
≈ Frost Gum
- 71C9D8
≈ Betsy
Triada +120° +240°
- 77CCBB
Jolly Jade
- C1ADEA
≈ Purple Sand
- E3AC81
≈ Sun Bleached Ochre
Komplementarna rozszczepiona +150° +210°
- 77CCBB
Jolly Jade
- D9A6D4
≈ Tiara Pink
- ECA599
≈ Peach Tile
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.88:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.13:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.13:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--jolly-jade: #77ccbb;
--jolly-jade-rgb: 119 204 187;
--jolly-jade-oklch: oklch(0.786 0.087 179.6);
}
.element {
color: var(--jolly-jade);
background-color: hsl(168 45% 63%);
border-color: oklch(0.786 0.087 179.6);
}Tailwind CSS v4
@theme {
--color-jolly-jade: #77ccbb;
--color-jolly-jade-50: #dbfef7;
--color-jolly-jade-100: #c9f2ea;
--color-jolly-jade-200: #ace1d7;
--color-jolly-jade-300: #84c6ba;
--color-jolly-jade-400: #60afa0;
--color-jolly-jade-500: #349988;
--color-jolly-jade-600: #2e8173;
--color-jolly-jade-700: #25685c;
--color-jolly-jade-800: #1a4c42;
--color-jolly-jade-900: #11352e;
--color-jolly-jade-950: #03201a;
}SCSS
$jolly-jade: #77ccbb;
$jolly-jade-rgb: 119, 204, 187;
$jolly-jade-light: mix(#fff, $jolly-jade, 20%);
$jolly-jade-dark: mix(#000, $jolly-jade, 20%);
.element {
color: $jolly-jade;
box-shadow: 0 0 0 2px rgba($jolly-jade, 0.35);
}