이름 색상 · #A87F5F
S’mores
S’mores은(는) #A87F5F: rgb(168 127 95), hsl(26 30% 52%), oklch(0.629 0.068 59.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · S’mores color name →
#A87F5F
oklch(0.629 0.068 59.1)
색상 변환
- HEX
- #a87f5f
- RGB
- rgb(168 127 95)
- HSL
- hsl(26 30% 52%)
- HWB
- hwb(26 37% 34%)
- OKLCH
- oklch(0.629 0.068 59.1)
- OKLab
- oklab(0.629 0.035 0.058)
- CIE Lab
- lab(56.7 13.27 23.87)
- LCH
- lch(56.7 27.31 60.9)
- CMYK
- cmyk(0% 24% 43% 34%)
틴트 · 셰이드 · 톤
틴트
- B18B6E
- BA987E
- C2A48D
- CBB19D
- D4BEAD
- DCCABD
- E5D7CD
- EEE4DE
- F6F2EE
셰이드
- 926E52
- 7C5D44
- 674C38
- 523C2C
- 3F2D20
- 2C1F15
- 1A110A
- 0A0603
- 010100
톤
- A47F63
- A07F66
- 9C806A
- 98806D
- 948070
- 908074
- 8C8077
- 88807A
- 84807D
색 조화
보색 +180°
- A87F5F
S’mores
- 618FAE
≈ Alpha Tango
유사색 -30° +30°
- A87F5F
S’mores
- AE7971
≈ Cranberry Foule
- 998758
≈ Spacious Plain
삼각 배색 +120° +240°
- A87F5F
S’mores
- 589789
≈ Fiddler
- 8E80AD
≈ Aster Purple
분열 보색 +150° +210°
- A87F5F
S’mores
- 54949F
≈ Star City
- 7887B3
≈ Corsican Purple
사각 배색 +90° +180° +270°
- A87F5F
S’mores
- 6C9572
≈ Tabbouleh
- 618FAE
≈ Alpha Tango
- A07A9D
≈ Divine
대비 및 접근성
Ag
Fail흰색 위
WCAG 3.57:1 · APCA Lc 63
Ag
AA검은색 위
WCAG 5.86:1 · APCA Lc 38
가장 좋은 글자색: #000000
WCAG 5.86:1 (AA) · APCA Lc 38
Contrast pairs
코드 스니펫
CSS
:root {
--s-mores: #a87f5f;
--s-mores-rgb: 168 127 95;
--s-mores-oklch: oklch(0.629 0.068 59.1);
}
.element {
color: var(--s-mores);
background-color: hsl(26 30% 52%);
border-color: oklch(0.629 0.068 59.1);
}Tailwind CSS v4
@theme {
--color-s-mores: #a87f5f;
--color-s-mores-50: #fff1e2;
--color-s-mores-100: #f9e3d2;
--color-s-mores-200: #ebceb7;
--color-s-mores-300: #d2b095;
--color-s-mores-400: #bd9576;
--color-s-mores-500: #a87b58;
--color-s-mores-600: #8e684b;
--color-s-mores-700: #72533c;
--color-s-mores-800: #553c2b;
--color-s-mores-900: #3b291d;
--color-s-mores-950: #25170d;
}SCSS
$s-mores: #a87f5f;
$s-mores-rgb: 168, 127, 95;
$s-mores-light: mix(#fff, $s-mores, 20%);
$s-mores-dark: mix(#000, $s-mores, 20%);
.element {
color: $s-mores;
box-shadow: 0 0 0 2px rgba($s-mores, 0.35);
}