Nazwany kolor · #4D8AA1
Cossack Dancer
Cossack Dancer to #4D8AA1: rgb(77 138 161), hsl(196 35% 47%), oklch(0.601 0.072 224.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Cyan mean? → · Cossack Dancer color name →
#4D8AA1
oklch(0.601 0.072 224.6)
Konwersje koloru
- HEX
- #4d8aa1
- RGB
- rgb(77 138 161)
- HSL
- hsl(196 35% 47%)
- HWB
- hwb(196 30% 37%)
- OKLCH
- oklch(0.601 0.072 224.6)
- OKLab
- oklab(0.601 -0.051 -0.051)
- CIE Lab
- lab(54.06 -15.58 -18.74)
- LCH
- lch(54.06 24.37 230.3)
- CMYK
- cmyk(52% 14% 0% 37%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5F95AA
- 71A1B4
- 83ACBD
- 95B8C6
- A6C3D0
- B8CFD9
- C9DBE2
- DBE7EC
- EDF3F5
Odcienie ciemniejsze
- 42778B
- 376576
- 2C5362
- 22424E
- 18323C
- 0F222A
- 071419
- 020709
- 000101
Tony
- 54899E
- 5A889B
- 5F8797
- 658694
- 6A8591
- 6E848D
- 73838A
- 788287
- 7C8183
Harmonie kolorów
Komplementarna +180°
- 4D8AA1
Cossack Dancer
- A5735D
≈ Chic Brick
Analogowa -30° +30°
- 4D8AA1
Cossack Dancer
- 468E8E
≈ Blue Chill
- 6383AB
≈ Navigator
Triada +120° +240°
- 4D8AA1
Cossack Dancer
- A06F8B
≈ Pink Jazz
- 87834F
≈ Sour Bubba
Komplementarna rozszczepiona +150° +210°
- 4D8AA1
Cossack Dancer
- A76F73
≈ Turkish Rose
- 9A7A4E
≈ Frontier Paradise
Tetrada +90° +180° +270°
- 4D8AA1
Cossack Dancer
- 91749F
≈ Diffused Orchid
- A5735D
≈ Chic Brick
- 6E8B5E
≈ Fern Canopy
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.84:1 · APCA Lc 66
Ag
AANa czerni
WCAG 5.46:1 · APCA Lc 36
Najlepszy kolor tekstu: #000000
WCAG 5.46:1 (AA) · APCA Lc 36
Contrast pairs
Fragmenty kodu
CSS
:root {
--cossack-dancer: #4d8aa1;
--cossack-dancer-rgb: 77 138 161;
--cossack-dancer-oklch: oklch(0.601 0.072 224.6);
}
.element {
color: var(--cossack-dancer);
background-color: hsl(196 35% 47%);
border-color: oklch(0.601 0.072 224.6);
}Tailwind CSS v4
@theme {
--color-cossack-dancer: #4d8aa1;
--color-cossack-dancer-50: #e1faff;
--color-cossack-dancer-100: #d0edfb;
--color-cossack-dancer-200: #b5dbec;
--color-cossack-dancer-300: #90c0d4;
--color-cossack-dancer-400: #6ea8bf;
--color-cossack-dancer-500: #4c90aa;
--color-cossack-dancer-600: #417a90;
--color-cossack-dancer-700: #346273;
--color-cossack-dancer-800: #234854;
--color-cossack-dancer-900: #18323b;
--color-cossack-dancer-950: #081e25;
}SCSS
$cossack-dancer: #4d8aa1;
$cossack-dancer-rgb: 77, 138, 161;
$cossack-dancer-light: mix(#fff, $cossack-dancer, 20%);
$cossack-dancer-dark: mix(#000, $cossack-dancer, 20%);
.element {
color: $cossack-dancer;
box-shadow: 0 0 0 2px rgba($cossack-dancer, 0.35);
}