Dichtstbijzijnde benoemde kleur · #69A2C1
#69A2C1
Dichtstbijzijnde benoemde kleur: Lake Lucerne
#69A2C1 (rgb(105 162 193), hsl(201 42% 58%), oklch(0.685 0.075 233.2)) komt het dichtst bij de benoemde kleur Lake Lucerne. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#69A2C1
oklch(0.685 0.075 233.2)
Kleurconversies
- HEX
- #69a2c1
- RGB
- rgb(105 162 193)
- HSL
- hsl(201 42% 58%)
- HWB
- hwb(201 41% 24%)
- OKLCH
- oklch(0.685 0.075 233.2)
- OKLab
- oklab(0.685 -0.045 -0.06)
- CIE Lab
- lab(63.57 -13.05 -22.23)
- LCH
- lch(63.57 25.77 239.6)
- CMYK
- cmyk(46% 16% 0% 24%)
Tinten · Schaduwen · Tonen
Tinten
- 78ABC7
- 87B4CE
- 96BED4
- A5C7DA
- B4D0E0
- C3D9E6
- D2E3ED
- E1ECF3
- F0F6F9
Schaduwen
- 5A8CA7
- 4C778F
- 3E6377
- 314F5F
- 243C49
- 182A34
- 0C1920
- 040A0E
- 000102
Tonen
- 6C9FBA
- 6F9BB4
- 7298AD
- 7495A7
- 7791A0
- 798E9A
- 7B8A93
- 7D878D
- 7E8386
Kleurharmonieën
Complementair +180°
- 69A2C1
Lake Lucerne
- BF8D6E
≈ Tiny Fawn
Analoog -30° +30°
- 69A2C1
Lake Lucerne
- 5DA8AE
≈ Aquarelle
- 819AC9
≈ Caribbean Sky
Triadisch +120° +240°
- 69A2C1
Lake Lucerne
- BF879E
≈ Mauvey Nude
- 999F68
≈ Dry Grass
Gesplitst complementair +150° +210°
- 69A2C1
Lake Lucerne
- C48884
≈ All’s Ace
- B09663
≈ Antelope
Tetradisch +90° +180° +270°
- 69A2C1
Lake Lucerne
- B18AB5
≈ Violet Whimsy
- BF8D6E
≈ Tiny Fawn
- 7EA67C
≈ Greyish Green
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.78:1 · APCA Lc 54
Ag
AAAOp zwart
WCAG 7.53:1 · APCA Lc 48
Beste tekstkleur: #000000
WCAG 7.53:1 (AAA) · APCA Lc 48
Contrast pairs
Codefragmenten
CSS
:root {
--lake-lucerne: #69a2c1;
--lake-lucerne-rgb: 105 162 193;
--lake-lucerne-oklch: oklch(0.685 0.075 233.2);
}
.element {
color: var(--lake-lucerne);
background-color: hsl(201 42% 58%);
border-color: oklch(0.685 0.075 233.2);
}Tailwind CSS v4
@theme {
--color-lake-lucerne: #69a2c1;
--color-lake-lucerne-50: #e1f9ff;
--color-lake-lucerne-100: #d1edfe;
--color-lake-lucerne-200: #b6daf0;
--color-lake-lucerne-300: #92bed9;
--color-lake-lucerne-400: #71a6c4;
--color-lake-lucerne-500: #4f8fb0;
--color-lake-lucerne-600: #447995;
--color-lake-lucerne-700: #366177;
--color-lake-lucerne-800: #254758;
--color-lake-lucerne-900: #19313d;
--color-lake-lucerne-950: #091d27;
}SCSS
$lake-lucerne: #69a2c1;
$lake-lucerne-rgb: 105, 162, 193;
$lake-lucerne-light: mix(#fff, $lake-lucerne, 20%);
$lake-lucerne-dark: mix(#000, $lake-lucerne, 20%);
.element {
color: $lake-lucerne;
box-shadow: 0 0 0 2px rgba($lake-lucerne, 0.35);
}