이름 색상 · #243640
Petrol Slumber
Petrol Slumber은(는) #243640: rgb(36 54 64), hsl(201 28% 20%), oklch(0.322 0.029 233.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Petrol Slumber color name →
#243640
oklch(0.322 0.029 233.2)
색상 변환
- HEX
- #243640
- RGB
- rgb(36 54 64)
- HSL
- hsl(201 28% 20%)
- HWB
- hwb(201 14% 75%)
- OKLCH
- oklch(0.322 0.029 233.2)
- OKLab
- oklab(0.322 -0.018 -0.024)
- CIE Lab
- lab(21.39 -5.24 -8.73)
- LCH
- lch(21.39 10.18 239)
- CMYK
- cmyk(44% 16% 0% 75%)
틴트 · 셰이드 · 톤
틴트
- 374851
- 4B5A63
- 5F6D75
- 748087
- 8A949A
- A0A9AE
- B7BEC1
- CFD3D6
- E7E9EA
셰이드
- 1E2E36
- 18252D
- 121E24
- 0C161B
- 070F13
- 04080B
- 020305
- 000101
- 000000
톤
- 2D3D46
- 35444C
- 3E4B53
- 475259
- 515A5F
- 5A6166
- 63696C
- 6D7073
- 767879
색 조화
보색 +180°
- 243640
Petrol Slumber
- 402F25
≈ After Eight
유사색 -30° +30°
- 243640
Petrol Slumber
- 21383A
≈ Kōrainando Green
- 2B3343
≈ Dress Blues
삼각 배색 +120° +240°
- 243640
Petrol Slumber
- 402D34
≈ Chocolate Plum
- 333524
≈ Fuchsia Berries
분열 보색 +150° +210°
- 243640
Petrol Slumber
- 412D2C
≈ Chocolate Plum
- 3B3222
≈ Agrax Earthshade
사각 배색 +90° +180° +270°
- 243640
Petrol Slumber
- 3B2E3C
≈ Valentino Nero
- 402F25
≈ After Eight
- 2A372A
≈ Aimiru Brown
대비 및 접근성
Ag
AAA흰색 위
WCAG 12.52:1 · APCA Lc 98
Ag
Fail검은색 위
WCAG 1.67:1 · APCA Lc 0
가장 좋은 글자색: #FFFFFF
WCAG 12.52:1 (AAA) · APCA Lc 98
Contrast pairs
코드 스니펫
CSS
:root {
--petrol-slumber: #243640;
--petrol-slumber-rgb: 36 54 64;
--petrol-slumber-oklch: oklch(0.322 0.029 233.2);
}
.element {
color: var(--petrol-slumber);
background-color: hsl(201 28% 20%);
border-color: oklch(0.322 0.029 233.2);
}Tailwind CSS v4
@theme {
--color-petrol-slumber: #243640;
--color-petrol-slumber-50: #eef7fc;
--color-petrol-slumber-100: #dfeaf0;
--color-petrol-slumber-200: #c9d7df;
--color-petrol-slumber-300: #aabac5;
--color-petrol-slumber-400: #8ea2ad;
--color-petrol-slumber-500: #738a97;
--color-petrol-slumber-600: #627580;
--color-petrol-slumber-700: #4e5d66;
--color-petrol-slumber-800: #38444b;
--color-petrol-slumber-900: #272f34;
--color-petrol-slumber-950: #151c1f;
}SCSS
$petrol-slumber: #243640;
$petrol-slumber-rgb: 36, 54, 64;
$petrol-slumber-light: mix(#fff, $petrol-slumber, 20%);
$petrol-slumber-dark: mix(#000, $petrol-slumber, 20%);
.element {
color: $petrol-slumber;
box-shadow: 0 0 0 2px rgba($petrol-slumber, 0.35);
}