이름 색상 · #BA8F7F
Rosetta
Rosetta은(는) #BA8F7F: rgb(186 143 127), hsl(16 30% 61%), oklch(0.687 0.057 41.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Rosetta color name →
#BA8F7F
oklch(0.687 0.057 41.3)
색상 변환
- HEX
- #ba8f7f
- RGB
- rgb(186 143 127)
- HSL
- hsl(16 30% 61%)
- HWB
- hwb(16 50% 27%)
- OKLCH
- oklch(0.687 0.057 41.3)
- OKLab
- oklab(0.687 0.043 0.038)
- CIE Lab
- lab(63.26 15.11 15.14)
- LCH
- lch(63.26 21.39 45.1)
- CMYK
- cmyk(0% 23% 32% 27%)
틴트 · 셰이드 · 톤
틴트
- C19A8B
- C8A598
- CFB0A4
- D6BBB1
- DDC6BD
- E4D1CA
- EBDDD7
- F2E8E4
- F8F3F2
셰이드
- A17C6E
- 89695D
- 72574C
- 5C453C
- 46342D
- 32241F
- 1E1511
- 0D0706
- 020101
톤
- B48E7F
- AF8C7F
- A98B80
- A38980
- 9D8880
- 978680
- 928580
- 8C8380
- 868280
색 조화
보색 +180°
- BA8F7F
Rosetta
- 72A3B4
≈ Estuary Blue
유사색 -30° +30°
- BA8F7F
Rosetta
- BB8C91
≈ Rosenkavalier
- B19573
≈ Coffee Kiss
삼각 배색 +120° +240°
- BA8F7F
Rosetta
- 7BA68F
≈ Free Green
- 9497BE
≈ Thistle Down
분열 보색 +150° +210°
- BA8F7F
Rosetta
- 70A6A3
≈ Steel Pan Mallet
- 809DBD
≈ Washed Denim
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.86:1 · APCA Lc 55
Ag
AAA검은색 위
WCAG 7.32:1 · APCA Lc 47
가장 좋은 글자색: #000000
WCAG 7.32:1 (AAA) · APCA Lc 47
Contrast pairs
코드 스니펫
CSS
:root {
--rosetta: #ba8f7f;
--rosetta-rgb: 186 143 127;
--rosetta-oklch: oklch(0.687 0.057 41.3);
}
.element {
color: var(--rosetta);
background-color: hsl(16 30% 61%);
border-color: oklch(0.687 0.057 41.3);
}Tailwind CSS v4
@theme {
--color-rosetta: #ba8f7f;
--color-rosetta-50: #fff0e8;
--color-rosetta-100: #fae2d9;
--color-rosetta-200: #ebcdc1;
--color-rosetta-300: #d2afa0;
--color-rosetta-400: #bd9484;
--color-rosetta-500: #a87a69;
--color-rosetta-600: #8e6759;
--color-rosetta-700: #725247;
--color-rosetta-800: #543c34;
--color-rosetta-900: #3b2923;
--color-rosetta-950: #251712;
}SCSS
$rosetta: #ba8f7f;
$rosetta-rgb: 186, 143, 127;
$rosetta-light: mix(#fff, $rosetta, 20%);
$rosetta-dark: mix(#000, $rosetta, 20%);
.element {
color: $rosetta;
box-shadow: 0 0 0 2px rgba($rosetta, 0.35);
}