Couleur nommée la plus proche · #9ECAE5
#9ECAE5
Couleur nommée la plus proche: Fail Whale
#9ECAE5 (rgb(158 202 229), hsl(203 58% 76%), oklch(0.817 0.06 235.4)) est la plus proche de la couleur nommée Fail Whale. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#9ECAE5
oklch(0.817 0.06 235.4)
Conversions de couleur
- HEX
- #9ecae5
- RGB
- rgb(158 202 229)
- HSL
- hsl(203 58% 76%)
- HWB
- hwb(203 62% 10%)
- OKLCH
- oklch(0.817 0.06 235.4)
- OKLab
- oklab(0.817 -0.034 -0.049)
- CIE Lab
- lab(78.87 -10.27 -18.42)
- LCH
- lch(78.87 21.09 240.9)
- CMYK
- cmyk(31% 12% 0% 10%)
Teintes · Ombres · Tons
Teintes
- A8CFE8
- B2D5EA
- BBDAED
- C5DFF0
- CFE5F2
- D8EAF5
- E2EFF7
- ECF4FA
- F5FAFD
Ombres
- 89AFC7
- 7495AA
- 607C8E
- 4D6472
- 3A4D58
- 29373F
- 182228
- 090F12
- 010203
Tons
- 9BC2DB
- 98BBD0
- 96B3C6
- 93ACBC
- 90A4B1
- 8D9DA7
- 8A969D
- 868E94
- 83878A
Harmonies de couleurs
Complémentaire +180°
- 9ECAE5
Fail Whale
- E2BA9E
≈ Sumptuous Peach
Analogue -30° +30°
- 9ECAE5
Fail Whale
- 95CFD6
≈ Peppermint Twist
- B1C3EB
≈ Larkspur Bud
Triadique +120° +240°
- 9ECAE5
Fail Whale
- E4B4C5
≈ Japanese Rose Garden
- C1C89C
≈ Seedling
Complémentaire divisée +150° +210°
- 9ECAE5
Fail Whale
- E8B5AF
≈ Pensive Pink
- D5C197
≈ Cache of Camel
Tétradique +90° +180° +270°
- 9ECAE5
Fail Whale
- D8B6D9
≈ Lilac Haze
- E2BA9E
≈ Sumptuous Peach
- ABCEAC
≈ Mint Circle
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.74:1 · APCA Lc 32
Ag
AAASur noir
WCAG 12.03:1 · APCA Lc 71
Meilleure couleur de texte: #000000
WCAG 12.03:1 (AAA) · APCA Lc 71
Contrast pairs
Extraits de code
CSS
:root {
--fail-whale: #9ecae5;
--fail-whale-rgb: 158 202 229;
--fail-whale-oklch: oklch(0.817 0.06 235.4);
}
.element {
color: var(--fail-whale);
background-color: hsl(203 58% 76%);
border-color: oklch(0.817 0.06 235.4);
}Tailwind CSS v4
@theme {
--color-fail-whale: #9ecae5;
--color-fail-whale-50: #e6f8ff;
--color-fail-whale-100: #d6ebfa;
--color-fail-whale-200: #bdd9eb;
--color-fail-whale-300: #9bbdd3;
--color-fail-whale-400: #7ca5bd;
--color-fail-whale-500: #5e8da9;
--color-fail-whale-600: #50778f;
--color-fail-whale-700: #405f72;
--color-fail-whale-800: #2d4654;
--color-fail-whale-900: #1e303b;
--color-fail-whale-950: #0e1d25;
}SCSS
$fail-whale: #9ecae5;
$fail-whale-rgb: 158, 202, 229;
$fail-whale-light: mix(#fff, $fail-whale, 20%);
$fail-whale-dark: mix(#000, $fail-whale, 20%);
.element {
color: $fail-whale;
box-shadow: 0 0 0 2px rgba($fail-whale, 0.35);
}