이름 색상 · #566A73
Distance
Distance은(는) #566A73: rgb(86 106 115), hsl(199 14% 39%), oklch(0.511 0.028 227). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Distance color name →
#566A73
oklch(0.511 0.028 227)
색상 변환
- HEX
- #566a73
- RGB
- rgb(86 106 115)
- HSL
- hsl(199 14% 39%)
- HWB
- hwb(199 34% 55%)
- OKLCH
- oklch(0.511 0.028 227)
- OKLab
- oklab(0.511 -0.019 -0.02)
- CIE Lab
- lab(43.42 -6.07 -7.66)
- LCH
- lch(43.42 9.78 231.6)
- CMYK
- cmyk(25% 8% 0% 55%)
틴트 · 셰이드 · 톤
틴트
- 667880
- 75868D
- 86949B
- 96A3A9
- A7B2B7
- B8C1C5
- C9D0D3
- DBDFE2
- EDEFF0
셰이드
- 4A5B63
- 3E4D54
- 323F45
- 273136
- 1C2428
- 12181B
- 080D0F
- 020405
- 000001
톤
- 5A6C74
- 5E6E76
- 637177
- 677378
- 6B757A
- 6F777B
- 73797C
- 787C7D
- 7C7E7F
색 조화
보색 +180°
- 566A73
Distance
- 756259
≈ Tea Bag
유사색 -30° +30°
- 566A73
Distance
- 546C6C
≈ Blue Ballet
- 5C6777
≈ Blue Zephyr
삼각 배색 +120° +240°
- 566A73
Distance
- 736069
≈ Smoked Mulberry
- 686855
≈ Green Gate
분열 보색 +150° +210°
- 566A73
Distance
- 766061
≈ Nasake
- 706555
≈ Never Cry Wolf
사각 배색 +90° +180° +270°
- 566A73
Distance
- 6D6271
≈ Iris Petal
- 756259
≈ Tea Bag
- 5F6A5B
≈ Italian Basil
대비 및 접근성
Ag
AA흰색 위
WCAG 5.66:1 · APCA Lc 78
Ag
Fail검은색 위
WCAG 3.70:1 · APCA Lc 23
가장 좋은 글자색: #FFFFFF
WCAG 5.66:1 (AA) · APCA Lc 78
Contrast pairs
코드 스니펫
CSS
:root {
--distance: #566a73;
--distance-rgb: 86 106 115;
--distance-oklch: oklch(0.511 0.028 227);
}
.element {
color: var(--distance);
background-color: hsl(199 14% 39%);
border-color: oklch(0.511 0.028 227);
}Tailwind CSS v4
@theme {
--color-distance: #566a73;
--color-distance-50: #edf7fc;
--color-distance-100: #dfeaef;
--color-distance-200: #c9d7de;
--color-distance-300: #a9bac3;
--color-distance-400: #8ea2ab;
--color-distance-500: #738a95;
--color-distance-600: #62757e;
--color-distance-700: #4e5e65;
--color-distance-800: #38454a;
--color-distance-900: #272f33;
--color-distance-950: #151c1f;
}SCSS
$distance: #566a73;
$distance-rgb: 86, 106, 115;
$distance-light: mix(#fff, $distance, 20%);
$distance-dark: mix(#000, $distance, 20%);
.element {
color: $distance;
box-shadow: 0 0 0 2px rgba($distance, 0.35);
}