이름 색상 · #24547D
Blueberry Twist
Blueberry Twist은(는) #24547D: rgb(36 84 125), hsl(208 55% 32%), oklch(0.433 0.086 247.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Blueberry Twist color name →
#24547D
oklch(0.433 0.086 247.2)
색상 변환
- HEX
- #24547d
- RGB
- rgb(36 84 125)
- HSL
- hsl(208 55% 32%)
- HWB
- hwb(208 14% 51%)
- OKLCH
- oklch(0.433 0.086 247.2)
- OKLab
- oklab(0.433 -0.033 -0.079)
- CIE Lab
- lab(33.96 -5.62 -28.47)
- LCH
- lch(33.96 29.02 258.8)
- CMYK
- cmyk(71% 33% 0% 51%)
틴트 · 셰이드 · 톤
틴트
- 3A648A
- 4F7497
- 6485A4
- 7996B1
- 8FA7BD
- A4B8CA
- BBC9D8
- D1DBE5
- E8EDF2
셰이드
- 1E486C
- 183C5B
- 12314B
- 0C263B
- 071B2C
- 04111E
- 020811
- 000205
- 000001
톤
- 2F597E
- 395D7E
- 42627F
- 4B667F
- 546B80
- 5D6F80
- 667380
- 6F7880
- 777C80
색 조화
보색 +180°
- 24547D
Blueberry Twist
- 6F4612
≈ Sepia
유사색 -30° +30°
- 24547D
Blueberry Twist
- 005B6C
≈ Brave New Teal
- 454B7F
≈ Highlands Twilight
삼각 배색 +120° +240°
- 24547D
Blueberry Twist
- 773B48
≈ July Ruby
- 445921
≈ Obscure Olive
분열 보색 +150° +210°
- 24547D
Blueberry Twist
- 783E2D
≈ Cowboy Suede
- 5E5008
≈ Olive Brown
사각 배색 +90° +180° +270°
- 24547D
Blueberry Twist
- 6E3D62
≈ Mystique Violet
- 6F4612
≈ Sepia
- 1E5E3D
≈ Greenbriar
대비 및 접근성
Ag
AAA흰색 위
WCAG 7.95:1 · APCA Lc 87
Ag
Fail검은색 위
WCAG 2.63:1 · APCA Lc 15
가장 좋은 글자색: #FFFFFF
WCAG 7.95:1 (AAA) · APCA Lc 87
Contrast pairs
코드 스니펫
CSS
:root {
--blueberry-twist: #24547d;
--blueberry-twist-rgb: 36 84 125;
--blueberry-twist-oklch: oklch(0.433 0.086 247.2);
}
.element {
color: var(--blueberry-twist);
background-color: hsl(208 55% 32%);
border-color: oklch(0.433 0.086 247.2);
}Tailwind CSS v4
@theme {
--color-blueberry-twist: #24547d;
--color-blueberry-twist-50: #e3f8ff;
--color-blueberry-twist-100: #d3ebff;
--color-blueberry-twist-200: #b9d8f8;
--color-blueberry-twist-300: #96bce2;
--color-blueberry-twist-400: #75a3cf;
--color-blueberry-twist-500: #558bbc;
--color-blueberry-twist-600: #49769f;
--color-blueberry-twist-700: #3a5e7f;
--color-blueberry-twist-800: #28455e;
--color-blueberry-twist-900: #1b3042;
--color-blueberry-twist-950: #0b1c2a;
}SCSS
$blueberry-twist: #24547d;
$blueberry-twist-rgb: 36, 84, 125;
$blueberry-twist-light: mix(#fff, $blueberry-twist, 20%);
$blueberry-twist-dark: mix(#000, $blueberry-twist, 20%);
.element {
color: $blueberry-twist;
box-shadow: 0 0 0 2px rgba($blueberry-twist, 0.35);
}