이름 색상 · #847451
Woodbridge
Woodbridge은(는) #847451: rgb(132 116 81), hsl(41 24% 42%), oklch(0.565 0.054 86.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Brown mean? → · Woodbridge color name →
#847451
oklch(0.565 0.054 86.1)
색상 변환
- HEX
- #847451
- RGB
- rgb(132 116 81)
- HSL
- hsl(41 24% 42%)
- HWB
- hwb(41 32% 48%)
- OKLCH
- oklch(0.565 0.054 86.1)
- OKLab
- oklab(0.565 0.004 0.054)
- CIE Lab
- lab(49.68 2.46 21.78)
- LCH
- lch(49.68 21.91 83.5)
- CMYK
- cmyk(0% 12% 39% 48%)
틴트 · 셰이드 · 톤
틴트
- 908161
- 9B8E72
- A79C83
- B4A994
- C0B7A5
- CCC5B7
- D9D4C8
- E5E2DA
- F2F0ED
셰이드
- 726445
- 60543A
- 4F452F
- 3F3724
- 2F291A
- 201B10
- 120F07
- 060502
- 010100
톤
- 847556
- 83775B
- 837860
- 827965
- 827A69
- 827B6E
- 817D72
- 817E77
- 807F7C
색 조화
보색 +180°
- 847451
Woodbridge
- 677696
≈ Lavender Mauve
유사색 -30° +30°
- 847451
Woodbridge
- 8F6E57
≈ Dig It
- 747A56
≈ Loden Green
삼각 배색 +120° +240°
- 847451
Woodbridge
- 4E7F86
≈ Tapestry Teal
- 876B87
≈ Mauveine
분열 보색 +150° +210°
- 847451
Woodbridge
- 577B92
≈ Titanium Blue
- 787092
≈ Parisian Violet
사각 배색 +90° +180° +270°
- 847451
Woodbridge
- 538175
≈ Frosty Spruce
- 677696
≈ Lavender Mauve
- 906977
≈ Full Glass
대비 및 접근성
Ag
AA흰색 위
WCAG 4.56:1 · APCA Lc 72
Ag
AA검은색 위
WCAG 4.59:1 · APCA Lc 30
가장 좋은 글자색: #000000
WCAG 4.59:1 (AA) · APCA Lc 30
Contrast pairs
코드 스니펫
CSS
:root {
--woodbridge: #847451;
--woodbridge-rgb: 132 116 81;
--woodbridge-oklch: oklch(0.565 0.054 86.1);
}
.element {
color: var(--woodbridge);
background-color: hsl(41 24% 42%);
border-color: oklch(0.565 0.054 86.1);
}Tailwind CSS v4
@theme {
--color-woodbridge: #847451;
--color-woodbridge-50: #fbf5e4;
--color-woodbridge-100: #efe7d4;
--color-woodbridge-200: #ded3bb;
--color-woodbridge-300: #c3b699;
--color-woodbridge-400: #ad9d7a;
--color-woodbridge-500: #96845d;
--color-woodbridge-600: #7f704f;
--color-woodbridge-700: #66593f;
--color-woodbridge-800: #4b412d;
--color-woodbridge-900: #342d1e;
--color-woodbridge-950: #201a0e;
}SCSS
$woodbridge: #847451;
$woodbridge-rgb: 132, 116, 81;
$woodbridge-light: mix(#fff, $woodbridge, 20%);
$woodbridge-dark: mix(#000, $woodbridge, 20%);
.element {
color: $woodbridge;
box-shadow: 0 0 0 2px rgba($woodbridge, 0.35);
}