Colore con nome · #505D7E
Coastal Fjord
Coastal Fjord è #505D7E: rgb(80 93 126), hsl(223 22% 40%), oklch(0.481 0.056 267.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Coastal Fjord color name →
#505D7E
oklch(0.481 0.056 267.7)
Conversioni di colore
- HEX
- #505d7e
- RGB
- rgb(80 93 126)
- HSL
- hsl(223 22% 40%)
- HWB
- hwb(223 31% 51%)
- OKLCH
- oklch(0.481 0.056 267.7)
- OKLab
- oklab(0.481 -0.002 -0.056)
- CIE Lab
- lab(39.41 1.44 -20.41)
- LCH
- lch(39.41 20.46 274)
- CMYK
- cmyk(37% 26% 0% 51%)
Tinte · Ombre · Toni
Tinte
- 606C8A
- 707B97
- 818BA4
- 929BB0
- A3ABBD
- B5BBCA
- C7CCD7
- D9DDE4
- ECEEF2
Ombre
- 44506D
- 39435C
- 2E374C
- 242A3C
- 1A1F2D
- 10141F
- 070A11
- 020305
- 000001
Toni
- 55617E
- 59647F
- 5E687F
- 636B7F
- 686F80
- 6C7280
- 717680
- 767980
- 7B7D80
Armonie di colore
Complementare +180°
- 505D7E
Coastal Fjord
- 6B5C38
≈ Plum Green
Analogo -30° +30°
- 505D7E
Coastal Fjord
- 3F637A
≈ Mallard Blue
- 61577A
≈ Taylor
Triadico +120° +240°
- 505D7E
Coastal Fjord
- 7B524C
≈ Vandyck Brown
- 48674C
≈ Green Perennial
Complementare divisa +150° +210°
- 505D7E
Coastal Fjord
- 76563E
≈ Leather & Lace
- 5B623E
≈ Down-to-Earth
Tetradico +90° +180° +270°
- 505D7E
Coastal Fjord
- 78515E
≈ Stravinsky Pink
- 6B5C38
≈ Plum Green
- 38685E
≈ Seiheki Green
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.54:1 · APCA Lc 82
Ag
FailSu nero
WCAG 3.20:1 · APCA Lc 20
Miglior colore del testo: #FFFFFF
WCAG 6.54:1 (AA) · APCA Lc 82
Contrast pairs
Frammenti di codice
CSS
:root {
--coastal-fjord: #505d7e;
--coastal-fjord-rgb: 80 93 126;
--coastal-fjord-oklch: oklch(0.481 0.056 267.7);
}
.element {
color: var(--coastal-fjord);
background-color: hsl(223 22% 40%);
border-color: oklch(0.481 0.056 267.7);
}Tailwind CSS v4
@theme {
--color-coastal-fjord: #505d7e;
--color-coastal-fjord-50: #eff5ff;
--color-coastal-fjord-100: #e0e8fb;
--color-coastal-fjord-200: #cbd4ed;
--color-coastal-fjord-300: #acb7d5;
--color-coastal-fjord-400: #909ec0;
--color-coastal-fjord-500: #7685ac;
--color-coastal-fjord-600: #647191;
--color-coastal-fjord-700: #505a75;
--color-coastal-fjord-800: #394256;
--color-coastal-fjord-900: #272e3c;
--color-coastal-fjord-950: #151a26;
}SCSS
$coastal-fjord: #505d7e;
$coastal-fjord-rgb: 80, 93, 126;
$coastal-fjord-light: mix(#fff, $coastal-fjord, 20%);
$coastal-fjord-dark: mix(#000, $coastal-fjord, 20%);
.element {
color: $coastal-fjord;
box-shadow: 0 0 0 2px rgba($coastal-fjord, 0.35);
}