Nazwany kolor · #BED3E1
Two Harbours
Two Harbours to #BED3E1: rgb(190 211 225), hsl(204 37% 81%), oklch(0.855 0.03 237). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Two Harbours color name →
#BED3E1
oklch(0.855 0.03 237)
Konwersje koloru
- HEX
- #bed3e1
- RGB
- rgb(190 211 225)
- HSL
- hsl(204 37% 81%)
- HWB
- hwb(204 75% 12%)
- OKLCH
- oklch(0.855 0.03 237)
- OKLab
- oklab(0.855 -0.016 -0.025)
- CIE Lab
- lab(83.29 -5.17 -9.46)
- LCH
- lch(83.29 10.78 241.3)
- CMYK
- cmyk(16% 6% 0% 12%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C4D7E4
- CBDCE7
- D1E0EA
- D8E4ED
- DEE9F0
- E5EDF3
- EBF2F6
- F2F6F9
- F8FBFC
Odcienie ciemniejsze
- A5B7C4
- 8C9CA7
- 75828B
- 5E6970
- 485156
- 333A3E
- 1F2427
- 0D1012
- 020202
Tony
- B8CAD7
- B1C2CD
- ABB9C3
- A5B1B9
- 9FA9AF
- 98A0A6
- 92989C
- 8C9093
- 868889
Harmonie kolorów
Komplementarna +180°
- BED3E1
Two Harbours
- DFCBBD
≈ Honey Lime Chicken
Analogowa -30° +30°
- BED3E1
Two Harbours
- BAD6D9
≈ Skylight
- C7CFE4
≈ Love Crystal
Triada +120° +240°
- BED3E1
Two Harbours
- E1C8D0
≈ Tinted Rosewood
- CED2BD
≈ Garlic Suede
Komplementarna rozszczepiona +150° +210°
- BED3E1
Two Harbours
- E3C9C5
≈ Satin Teddy
- D8CFBA
≈ Warm Oats
Tetrada +90° +180° +270°
- BED3E1
Two Harbours
- DBC9DA
≈ Creamy Mauve
- DFCBBD
≈ Honey Lime Chicken
- C3D5C4
≈ Misty Lake
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.54:1 · APCA Lc 25
Ag
AAANa czerni
WCAG 13.59:1 · APCA Lc 78
Najlepszy kolor tekstu: #000000
WCAG 13.59:1 (AAA) · APCA Lc 78
Contrast pairs
Fragmenty kodu
CSS
:root {
--two-harbours: #bed3e1;
--two-harbours-rgb: 190 211 225;
--two-harbours-oklch: oklch(0.855 0.03 237);
}
.element {
color: var(--two-harbours);
background-color: hsl(204 37% 81%);
border-color: oklch(0.855 0.03 237);
}Tailwind CSS v4
@theme {
--color-two-harbours: #bed3e1;
--color-two-harbours-50: #eef7fd;
--color-two-harbours-100: #dfeaf1;
--color-two-harbours-200: #c9d6e0;
--color-two-harbours-300: #aabac5;
--color-two-harbours-400: #8ea2ae;
--color-two-harbours-500: #748a98;
--color-two-harbours-600: #627480;
--color-two-harbours-700: #4f5d67;
--color-two-harbours-800: #39444b;
--color-two-harbours-900: #272f34;
--color-two-harbours-950: #151c20;
}SCSS
$two-harbours: #bed3e1;
$two-harbours-rgb: 190, 211, 225;
$two-harbours-light: mix(#fff, $two-harbours, 20%);
$two-harbours-dark: mix(#000, $two-harbours, 20%);
.element {
color: $two-harbours;
box-shadow: 0 0 0 2px rgba($two-harbours, 0.35);
}