Nazwany kolor · #4A5E6C
Ragtime Blues
Ragtime Blues to #4A5E6C: rgb(74 94 108), hsl(205 19% 36%), oklch(0.471 0.033 238.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Ragtime Blues color name →
#4A5E6C
oklch(0.471 0.033 238.9)
Konwersje koloru
- HEX
- #4a5e6c
- RGB
- rgb(74 94 108)
- HSL
- hsl(205 19% 36%)
- HWB
- hwb(205 29% 58%)
- OKLCH
- oklch(0.471 0.033 238.9)
- OKLab
- oklab(0.471 -0.017 -0.029)
- CIE Lab
- lab(38.65 -5.1 -10.63)
- LCH
- lch(38.65 11.79 244.4)
- CMYK
- cmyk(31% 13% 0% 58%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5A6D7A
- 6B7C88
- 7D8B96
- 8E9BA4
- A0ABB3
- B3BBC2
- C5CCD1
- D8DDE0
- EBEEEF
Odcienie ciemniejsze
- 3F515D
- 35444E
- 2A3740
- 202B32
- 171F25
- 0E1419
- 060A0D
- 020304
- 000000
Tony
- 4F616E
- 556570
- 5A6872
- 5F6C74
- 656F76
- 6A7278
- 70767A
- 75797C
- 7B7D7E
Harmonie kolorów
Komplementarna +180°
- 4A5E6C
Ragtime Blues
- 6A5749
≈ Chocolate Chunk
Analogowa -30° +30°
- 4A5E6C
Ragtime Blues
- 456165
≈ Linen Grey
- 535B6E
≈ Midnight Sun
Triada +120° +240°
- 4A5E6C
Ragtime Blues
- 6B535B
≈ Mocha Brown
- 595E49
≈ Almond Green
Komplementarna rozszczepiona +150° +210°
- 4A5E6C
Ragtime Blues
- 6D5450
≈ Painted Leather
- 635A46
≈ Grand Avenue
Tetrada +90° +180° +270°
- 4A5E6C
Ragtime Blues
- 665564
≈ Grand Grape
- 6A5749
≈ Chocolate Chunk
- 4E6151
≈ Hampton Green
Kontrast i dostępność
Ag
AANa bieli
WCAG 6.75:1 · APCA Lc 83
Ag
FailNa czerni
WCAG 3.10:1 · APCA Lc 19
Najlepszy kolor tekstu: #FFFFFF
WCAG 6.75:1 (AA) · APCA Lc 83
Contrast pairs
Fragmenty kodu
CSS
:root {
--ragtime-blues: #4a5e6c;
--ragtime-blues-rgb: 74 94 108;
--ragtime-blues-oklch: oklch(0.471 0.033 238.9);
}
.element {
color: var(--ragtime-blues);
background-color: hsl(205 19% 36%);
border-color: oklch(0.471 0.033 238.9);
}Tailwind CSS v4
@theme {
--color-ragtime-blues: #4a5e6c;
--color-ragtime-blues-50: #edf7fe;
--color-ragtime-blues-100: #dfeaf2;
--color-ragtime-blues-200: #c8d6e1;
--color-ragtime-blues-300: #a9bac7;
--color-ragtime-blues-400: #8da2b0;
--color-ragtime-blues-500: #728a9a;
--color-ragtime-blues-600: #617582;
--color-ragtime-blues-700: #4d5d68;
--color-ragtime-blues-800: #38444d;
--color-ragtime-blues-900: #262f35;
--color-ragtime-blues-950: #141c20;
}SCSS
$ragtime-blues: #4a5e6c;
$ragtime-blues-rgb: 74, 94, 108;
$ragtime-blues-light: mix(#fff, $ragtime-blues, 20%);
$ragtime-blues-dark: mix(#000, $ragtime-blues, 20%);
.element {
color: $ragtime-blues;
box-shadow: 0 0 0 2px rgba($ragtime-blues, 0.35);
}