Colore con nome · #D9DDE7
Sweet Harbour
Sweet Harbour è #D9DDE7: rgb(217 221 231), hsl(223 23% 88%), oklch(0.897 0.014 268.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Sweet Harbour color name →
#D9DDE7
oklch(0.897 0.014 268.5)
Conversioni di colore
- HEX
- #d9dde7
- RGB
- rgb(217 221 231)
- HSL
- hsl(223 23% 88%)
- HWB
- hwb(223 85% 9%)
- OKLCH
- oklch(0.897 0.014 268.5)
- OKLab
- oklab(0.897 0 -0.014)
- CIE Lab
- lab(88.02 -0.01 -5.41)
- LCH
- lch(88.02 5.41 269.9)
- CMYK
- cmyk(6% 4% 0% 9%)
Tinte · Ombre · Toni
Tinte
- DDE0E9
- E1E4EC
- E4E7EE
- E8EBF1
- ECEEF3
- F0F1F5
- F3F5F8
- F7F8FA
- FBFCFD
Ombre
- BCC0C9
- A1A4AB
- 86888F
- 6C6E73
- 535559
- 3B3D40
- 252628
- 111113
- 020203
Toni
- D0D3DC
- C7CAD2
- BDC0C7
- B4B7BD
- ABADB2
- A3A4A8
- 9A9B9E
- 919294
- 88898A
Armonie di colore
Complementare +180°
- D9DDE7
Sweet Harbour
- E1DDD3
≈ Clear Stone
Analogo -30° +30°
- D9DDE7
Sweet Harbour
- D5DFE6
≈ Blustery Day
- DEDBE6
≈ Pale Orchid
Triadico +120° +240°
- D9DDE7
Sweet Harbour
- E7DAD8
≈ Light Porcelain
- D7E0D8
≈ Juniper Breeze
Complementare divisa +150° +210°
- D9DDE7
Sweet Harbour
- E5DBD4
≈ Hush White
- DCDFD4
≈ Angel’s Whisper
Tetradico +90° +180° +270°
- D9DDE7
Sweet Harbour
- E6D9DD
≈ Faded Firebrick
- E1DDD3
≈ Clear Stone
- D4E0DD
≈ Spring Mist
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.35:1 · APCA Lc 18
Ag
AAASu nero
WCAG 15.44:1 · APCA Lc 86
Miglior colore del testo: #000000
WCAG 15.44:1 (AAA) · APCA Lc 86
Contrast pairs
Frammenti di codice
CSS
:root {
--sweet-harbour: #d9dde7;
--sweet-harbour-rgb: 217 221 231;
--sweet-harbour-oklch: oklch(0.897 0.014 268.5);
}
.element {
color: var(--sweet-harbour);
background-color: hsl(223 23% 88%);
border-color: oklch(0.897 0.014 268.5);
}Tailwind CSS v4
@theme {
--color-sweet-harbour: #d9dde7;
--color-sweet-harbour-50: #f3f5f9;
--color-sweet-harbour-100: #e6e8ed;
--color-sweet-harbour-200: #d2d4db;
--color-sweet-harbour-300: #b4b7bf;
--color-sweet-harbour-400: #9b9ea7;
--color-sweet-harbour-500: #828690;
--color-sweet-harbour-600: #6e717a;
--color-sweet-harbour-700: #585b61;
--color-sweet-harbour-800: #404247;
--color-sweet-harbour-900: #2c2e32;
--color-sweet-harbour-950: #191b1d;
}SCSS
$sweet-harbour: #d9dde7;
$sweet-harbour-rgb: 217, 221, 231;
$sweet-harbour-light: mix(#fff, $sweet-harbour, 20%);
$sweet-harbour-dark: mix(#000, $sweet-harbour, 20%);
.element {
color: $sweet-harbour;
box-shadow: 0 0 0 2px rgba($sweet-harbour, 0.35);
}