Najbliższy nazwany kolor · #68A2C3
#68A2C3
Najbliższy nazwany kolor: Wandering River
#68A2C3 (rgb(104 162 195), hsl(202 43% 59%), oklch(0.685 0.078 234.5)) jest najbliższy nazwanemu kolorowi Wandering River. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#68A2C3
oklch(0.685 0.078 234.5)
Konwersje koloru
- HEX
- #68a2c3
- RGB
- rgb(104 162 195)
- HSL
- hsl(202 43% 59%)
- HWB
- hwb(202 41% 24%)
- OKLCH
- oklch(0.685 0.078 234.5)
- OKLab
- oklab(0.685 -0.045 -0.063)
- CIE Lab
- lab(63.58 -12.88 -23.33)
- LCH
- lch(63.58 26.64 241.1)
- CMYK
- cmyk(47% 17% 0% 24%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 77ABC9
- 87B4CF
- 96BED5
- A5C7DB
- B4D0E1
- C3D9E7
- D2E3ED
- E1ECF3
- F0F6F9
Odcienie ciemniejsze
- 598CA9
- 4B7790
- 3E6378
- 304F60
- 243C4A
- 182A34
- 0C1920
- 040A0E
- 000102
Tony
- 6B9FBC
- 6E9BB5
- 7198AF
- 7495A8
- 7691A1
- 798E9B
- 7B8A94
- 7D878D
- 7E8487
Harmonie kolorów
Komplementarna +180°
- 68A2C3
Wandering River
- C08D6B
≈ Nobody but Ben
Analogowa -30° +30°
- 68A2C3
Wandering River
- 5AA8B0
≈ Gone Fishing
- 829ACB
≈ Caribbean Sky
Triada +120° +240°
- 68A2C3
Wandering River
- C1869D
≈ Winsome Rose
- 98A067
≈ Banana Palm
Komplementarna rozszczepiona +150° +210°
- 68A2C3
Wandering River
- C68782
≈ All’s Ace
- B09661
≈ Antelope
Tetrada +90° +180° +270°
- 68A2C3
Wandering River
- B28AB5
≈ Violet Whimsy
- C08D6B
≈ Nobody but Ben
- 7CA77C
≈ Greyish Green
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.78:1 · APCA Lc 54
Ag
AAANa czerni
WCAG 7.54:1 · APCA Lc 48
Najlepszy kolor tekstu: #000000
WCAG 7.54:1 (AAA) · APCA Lc 48
Contrast pairs
Fragmenty kodu
CSS
:root {
--wandering-river: #68a2c3;
--wandering-river-rgb: 104 162 195;
--wandering-river-oklch: oklch(0.685 0.078 234.5);
}
.element {
color: var(--wandering-river);
background-color: hsl(202 43% 59%);
border-color: oklch(0.685 0.078 234.5);
}Tailwind CSS v4
@theme {
--color-wandering-river: #68a2c3;
--color-wandering-river-50: #e1f9ff;
--color-wandering-river-100: #d0edff;
--color-wandering-river-200: #b6daf2;
--color-wandering-river-300: #92beda;
--color-wandering-river-400: #70a6c6;
--color-wandering-river-500: #4e8fb2;
--color-wandering-river-600: #437996;
--color-wandering-river-700: #356179;
--color-wandering-river-800: #244759;
--color-wandering-river-900: #18313e;
--color-wandering-river-950: #091d27;
}SCSS
$wandering-river: #68a2c3;
$wandering-river-rgb: 104, 162, 195;
$wandering-river-light: mix(#fff, $wandering-river, 20%);
$wandering-river-dark: mix(#000, $wandering-river, 20%);
.element {
color: $wandering-river;
box-shadow: 0 0 0 2px rgba($wandering-river, 0.35);
}