Colore con nome · #3B5F83
Atlantic Schooner
Atlantic Schooner è #3B5F83: rgb(59 95 131), hsl(210 38% 37%), oklch(0.474 0.072 249.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Atlantic Schooner color name →
#3B5F83
oklch(0.474 0.072 249.6)
Conversioni di colore
- HEX
- #3b5f83
- RGB
- rgb(59 95 131)
- HSL
- hsl(210 38% 37%)
- HWB
- hwb(210 23% 49%)
- OKLCH
- oklch(0.474 0.072 249.6)
- OKLab
- oklab(0.474 -0.025 -0.067)
- CIE Lab
- lab(38.82 -4.85 -24.49)
- LCH
- lch(38.82 24.96 258.8)
- CMYK
- cmyk(55% 27% 0% 49%)
Tinte · Ombre · Toni
Tinte
- 4D6E8F
- 607D9B
- 738DA8
- 869CB4
- 99ACC0
- ADBCCD
- C1CDD9
- D5DDE6
- EAEEF2
Ombre
- 325271
- 294460
- 21384F
- 192C3F
- 11202F
- 091520
- 040A12
- 010306
- 000001
Toni
- 426283
- 496683
- 506983
- 576D83
- 5E7082
- 657382
- 6C7682
- 737A81
- 797D81
Armonie di colore
Complementare +180°
- 3B5F83
Atlantic Schooner
- 76542C
≈ Bark Brown
Analogo -30° +30°
- 3B5F83
Atlantic Schooner
- 226578
≈ Bold Bolection
- 545784
≈ Mauve Dusk
Triadico +120° +240°
- 3B5F83
Atlantic Schooner
- 7F4A53
≈ Parauri Brown
- 4F6438
≈ Garden Green
Complementare divisa +150° +210°
- 3B5F83
Atlantic Schooner
- 7F4E3D
≈ Nougat Brown
- 665D29
≈ Bean Green
Tetradico +90° +180° +270°
- 3B5F83
Atlantic Schooner
- 774C69
≈ Fig Cluster
- 76542C
≈ Bark Brown
- 34684E
≈ Spirulina
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.66:1 · APCA Lc 83
Ag
FailSu nero
WCAG 3.15:1 · APCA Lc 19
Miglior colore del testo: #FFFFFF
WCAG 6.66:1 (AA) · APCA Lc 83
Contrast pairs
Frammenti di codice
CSS
:root {
--atlantic-schooner: #3b5f83;
--atlantic-schooner-rgb: 59 95 131;
--atlantic-schooner-oklch: oklch(0.474 0.072 249.6);
}
.element {
color: var(--atlantic-schooner);
background-color: hsl(210 38% 37%);
border-color: oklch(0.474 0.072 249.6);
}Tailwind CSS v4
@theme {
--color-atlantic-schooner: #3b5f83;
--color-atlantic-schooner-50: #e7f7ff;
--color-atlantic-schooner-100: #d7eaff;
--color-atlantic-schooner-200: #bed7f3;
--color-atlantic-schooner-300: #9dbbdc;
--color-atlantic-schooner-400: #7ea2c8;
--color-atlantic-schooner-500: #608ab4;
--color-atlantic-schooner-600: #527598;
--color-atlantic-schooner-700: #415d7a;
--color-atlantic-schooner-800: #2e455a;
--color-atlantic-schooner-900: #1f303f;
--color-atlantic-schooner-950: #0f1c28;
}SCSS
$atlantic-schooner: #3b5f83;
$atlantic-schooner-rgb: 59, 95, 131;
$atlantic-schooner-light: mix(#fff, $atlantic-schooner, 20%);
$atlantic-schooner-dark: mix(#000, $atlantic-schooner, 20%);
.element {
color: $atlantic-schooner;
box-shadow: 0 0 0 2px rgba($atlantic-schooner, 0.35);
}