이름 색상 · #A85533
Vesuvius
Vesuvius은(는) #A85533: rgb(168 85 51), hsl(17 53% 43%), oklch(0.544 0.119 42.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Vesuvius color name →
#A85533
oklch(0.544 0.119 42.1)
색상 변환
- HEX
- #a85533
- RGB
- rgb(168 85 51)
- HSL
- hsl(17 53% 43%)
- HWB
- hwb(17 20% 34%)
- OKLCH
- oklch(0.544 0.119 42.1)
- OKLab
- oklab(0.544 0.088 0.08)
- CIE Lab
- lab(46.21 32.9 35.63)
- LCH
- lch(46.21 48.49 47.3)
- CMYK
- cmyk(0% 49% 70% 34%)
틴트 · 셰이드 · 톤
틴트
- B26648
- BC775C
- C58770
- CE9883
- D7A997
- DFBAAC
- E8CBC0
- F0DCD5
- F7EEEA
셰이드
- 92492B
- 7C3D23
- 67311C
- 522614
- 3F1C0D
- 2C1107
- 1A0803
- 0A0201
- 010000
톤
- A55A3C
- A25F45
- 9E644D
- 9B6855
- 976D5C
- 937164
- 8E756B
- 8A7972
- 857C79
색 조화
보색 +180°
- A85533
Vesuvius
- 007C9A
≈ Pacific Pleasure
유사색 -30° +30°
- A85533
Vesuvius
- A94F5D
≈ Rose Vale
- 996300
≈ Raw Sienna
삼각 배색 +120° +240°
- A85533
Vesuvius
- 00855A
≈ Primal Green
- 6665B3
≈ Bluish Purple Anemone
분열 보색 +150° +210°
- A85533
Vesuvius
- 00817E
≈ Belly Flop
- 3672B3
≈ Campanula
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
AA흰색 위
WCAG 5.23:1 · APCA Lc 76
Ag
Fail검은색 위
WCAG 4.01:1 · APCA Lc 26
가장 좋은 글자색: #FFFFFF
WCAG 5.23:1 (AA) · APCA Lc 76
Contrast pairs
코드 스니펫
CSS
:root {
--vesuvius: #a85533;
--vesuvius-rgb: 168 85 51;
--vesuvius-oklch: oklch(0.544 0.119 42.1);
}
.element {
color: var(--vesuvius);
background-color: hsl(17 53% 43%);
border-color: oklch(0.544 0.119 42.1);
}Tailwind CSS v4
@theme {
--color-vesuvius: #a85533;
--color-vesuvius-50: #ffebda;
--color-vesuvius-100: #ffdcc8;
--color-vesuvius-200: #ffc5ab;
--color-vesuvius-300: #eba485;
--color-vesuvius-400: #d98665;
--color-vesuvius-500: #c66842;
--color-vesuvius-600: #a85939;
--color-vesuvius-700: #87472d;
--color-vesuvius-800: #643221;
--color-vesuvius-900: #472215;
--color-vesuvius-950: #2e1107;
}SCSS
$vesuvius: #a85533;
$vesuvius-rgb: 168, 85, 51;
$vesuvius-light: mix(#fff, $vesuvius, 20%);
$vesuvius-dark: mix(#000, $vesuvius, 20%);
.element {
color: $vesuvius;
box-shadow: 0 0 0 2px rgba($vesuvius, 0.35);
}