Colore con nome · #4F84AF
Ship’s Harbour
Ship’s Harbour è #4F84AF: rgb(79 132 175), hsl(207 38% 50%), oklch(0.594 0.087 244.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Ship’s Harbour color name →
#4F84AF
oklch(0.594 0.087 244.5)
Conversioni di colore
- HEX
- #4f84af
- RGB
- rgb(79 132 175)
- HSL
- hsl(207 38% 50%)
- HWB
- hwb(207 31% 31%)
- OKLCH
- oklch(0.594 0.087 244.5)
- OKLab
- oklab(0.594 -0.038 -0.079)
- CIE Lab
- lab(52.82 -8.62 -28.65)
- LCH
- lch(52.82 29.91 253.3)
- CMYK
- cmyk(55% 25% 0% 31%)
Tinte · Ombre · Toni
Tinte
- 6190B7
- 729CBF
- 83A8C7
- 95B4CF
- A6C1D7
- B8CDDF
- C9D9E7
- DBE6EF
- EDF2F7
Ombre
- 447298
- 386081
- 2E4F6B
- 233F56
- 192F41
- 10202E
- 07121C
- 02060B
- 000101
Toni
- 5584AA
- 5B84A6
- 6083A1
- 65839D
- 6A8398
- 6E8293
- 73828F
- 77818A
- 7C8185
Armonie di colore
Complementare +180°
- 4F84AF
Ship’s Harbour
- A37344
≈ Red-Tailed-Hawk
Analogo -30° +30°
- 4F84AF
Ship’s Harbour
- 338C9F
≈ Scooter
- 6F7AB3
≈ Magic Moment
Triadico +120° +240°
- 4F84AF
Ship’s Harbour
- AA6878
≈ Apple II Rose
- 73884C
≈ Green Suede
Complementare divisa +150° +210°
- 4F84AF
Ship’s Harbour
- AC6B5B
≈ Bantam Egg
- 8F7E3D
≈ Peas Please
Tetradico +90° +180° +270°
- 4F84AF
Ship’s Harbour
- 9F6A94
≈ Flowering Raspberry
- A37344
≈ Red-Tailed-Hawk
- 528E67
≈ Green Weed
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.99:1 · APCA Lc 67
Ag
AASu nero
WCAG 5.25:1 · APCA Lc 35
Miglior colore del testo: #000000
WCAG 5.25:1 (AA) · APCA Lc 35
Contrast pairs
Frammenti di codice
CSS
:root {
--ship-s-harbour: #4f84af;
--ship-s-harbour-rgb: 79 132 175;
--ship-s-harbour-oklch: oklch(0.594 0.087 244.5);
}
.element {
color: var(--ship-s-harbour);
background-color: hsl(207 38% 50%);
border-color: oklch(0.594 0.087 244.5);
}Tailwind CSS v4
@theme {
--color-ship-s-harbour: #4f84af;
--color-ship-s-harbour-50: #e2f8ff;
--color-ship-s-harbour-100: #d1ebff;
--color-ship-s-harbour-200: #b7d9f8;
--color-ship-s-harbour-300: #93bce2;
--color-ship-s-harbour-400: #71a4cf;
--color-ship-s-harbour-500: #518cbc;
--color-ship-s-harbour-600: #45779f;
--color-ship-s-harbour-700: #375f7f;
--color-ship-s-harbour-800: #25465e;
--color-ship-s-harbour-900: #193042;
--color-ship-s-harbour-950: #091c2a;
}SCSS
$ship-s-harbour: #4f84af;
$ship-s-harbour-rgb: 79, 132, 175;
$ship-s-harbour-light: mix(#fff, $ship-s-harbour, 20%);
$ship-s-harbour-dark: mix(#000, $ship-s-harbour, 20%);
.element {
color: $ship-s-harbour;
box-shadow: 0 0 0 2px rgba($ship-s-harbour, 0.35);
}