이름 색상 · #5984A8
Peyton
Peyton은(는) #5984A8: rgb(89 132 168), hsl(207 31% 50%), oklch(0.596 0.073 244.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Peyton color name →
#5984A8
oklch(0.596 0.073 244.7)
색상 변환
- HEX
- #5984a8
- RGB
- rgb(89 132 168)
- HSL
- hsl(207 31% 50%)
- HWB
- hwb(207 35% 34%)
- OKLCH
- oklch(0.596 0.073 244.7)
- OKLab
- oklab(0.596 -0.031 -0.066)
- CIE Lab
- lab(53.1 -7.68 -24.15)
- LCH
- lch(53.1 25.34 252.3)
- CMYK
- cmyk(47% 21% 0% 34%)
틴트 · 셰이드 · 톤
틴트
- 6990B1
- 799CB9
- 8AA8C2
- 9AB4CB
- AAC0D4
- BBCDDC
- CCD9E5
- DDE6EE
- EEF2F6
셰이드
- 4C7292
- 40607C
- 344F67
- 283F52
- 1D2F3F
- 13202C
- 09121A
- 03060A
- 000101
톤
- 5D84A4
- 6283A0
- 66839C
- 6A8398
- 6E8294
- 728290
- 75828C
- 798188
- 7D8184
색 조화
보색 +180°
- 5984A8
Peyton
- 9E7650
≈ Mocha
유사색 -30° +30°
- 5984A8
Peyton
- 468A9A
≈ Hippie Blue
- 727CAB
≈ Bright Zenith
삼각 배색 +120° +240°
- 5984A8
Peyton
- A56D79
≈ Black Elder
- 758756
≈ Snip of Parsley
분열 보색 +150° +210°
- 5984A8
Peyton
- A66F62
≈ Blast-Off Bronze
- 8D7F4B
≈ Ovoid Fruit
사각 배색 +90° +180° +270°
- 5984A8
Peyton
- 9B6F91
≈ Pink Jazz
- 9E7650
≈ Mocha
- 5B8C6C
≈ Murdoch
대비 및 접근성
Ag
Fail흰색 위
WCAG 3.96:1 · APCA Lc 67
Ag
AA검은색 위
WCAG 5.29:1 · APCA Lc 35
가장 좋은 글자색: #000000
WCAG 5.29:1 (AA) · APCA Lc 35
Contrast pairs
코드 스니펫
CSS
:root {
--peyton: #5984a8;
--peyton-rgb: 89 132 168;
--peyton-oklch: oklch(0.596 0.073 244.7);
}
.element {
color: var(--peyton);
background-color: hsl(207 31% 50%);
border-color: oklch(0.596 0.073 244.7);
}Tailwind CSS v4
@theme {
--color-peyton: #5984a8;
--color-peyton-50: #e5f8ff;
--color-peyton-100: #d5ebff;
--color-peyton-200: #bcd8f2;
--color-peyton-300: #9abcdb;
--color-peyton-400: #7aa4c7;
--color-peyton-500: #5b8bb3;
--color-peyton-600: #4e7698;
--color-peyton-700: #3e5e7a;
--color-peyton-800: #2b455a;
--color-peyton-900: #1d303f;
--color-peyton-950: #0d1c28;
}SCSS
$peyton: #5984a8;
$peyton-rgb: 89, 132, 168;
$peyton-light: mix(#fff, $peyton, 20%);
$peyton-dark: mix(#000, $peyton, 20%);
.element {
color: $peyton;
box-shadow: 0 0 0 2px rgba($peyton, 0.35);
}