Màu có tên gần nhất · #663036
#663036
Màu có tên gần nhất: Chocolate Truffle
#663036 (rgb(102 48 54), hsl(353 36% 29%), oklch(0.383 0.078 14.5)) gần nhất với màu có tên Chocolate Truffle. Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
#663036
oklch(0.383 0.078 14.5)
Chuyển đổi màu
- HEX
- #663036
- RGB
- rgb(102 48 54)
- HSL
- hsl(353 36% 29%)
- HWB
- hwb(353 19% 60%)
- OKLCH
- oklch(0.383 0.078 14.5)
- OKLab
- oklab(0.383 0.075 0.019)
- CIE Lab
- lab(27.57 25.25 8.09)
- LCH
- lch(27.57 26.51 17.8)
- CMYK
- cmyk(0% 53% 47% 60%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- 754348
- 85565A
- 946A6D
- A37E80
- B39294
- C2A7A9
- D1BDBE
- E0D2D3
- F0E9E9
Sắc đậm
- 58282E
- 4A2125
- 3C1A1E
- 2F1316
- 230C0F
- 170608
- 0C0303
- 040101
- 000000
Sắc xám
- 69383D
- 6D4044
- 70484B
- 735052
- 75585A
- 786061
- 7A6869
- 7C7070
- 7E7878
Hòa sắc
Bổ túc +180°
- 663036
Chocolate Truffle
- 004E4E
≈ Antique Turquoise
Tương đồng -30° +30°
- 663036
Chocolate Truffle
- 60314D
≈ Grape Wine
- 65341E
≈ Freshly Roasted Coffee
Bộ ba +120° +240°
- 663036
Chocolate Truffle
- 314C1F
≈ Chestnut Green
- 24446C
≈ Nightlife
Bổ túc chia +150° +210°
- 663036
Chocolate Truffle
- 075038
≈ Chrysocolla Dark Green
- 004B60
≈ Lazurite Blue
Bộ bốn +90° +180° +270°
- 663036
Chocolate Truffle
- 4A4506
≈ Alligator Gladiator
- 004E4E
≈ Antique Turquoise
- 3F3C6B
≈ American Blue
Tương phản và khả năng tiếp cận
Ag
AAATrên nền trắng
WCAG 10.28:1 · APCA Lc 94
Ag
FailTrên nền đen
WCAG 2.04:1 · APCA Lc 9
Màu chữ tốt nhất: #FFFFFF
WCAG 10.28:1 (AAA) · APCA Lc 94
Contrast pairs
Đoạn mã
CSS
:root {
--chocolate-truffle: #663036;
--chocolate-truffle-rgb: 102 48 54;
--chocolate-truffle-oklch: oklch(0.383 0.078 14.5);
}
.element {
color: var(--chocolate-truffle);
background-color: hsl(353 36% 29%);
border-color: oklch(0.383 0.078 14.5);
}Tailwind CSS v4
@theme {
--color-chocolate-truffle: #663036;
--color-chocolate-truffle-50: #ffeded;
--color-chocolate-truffle-100: #ffdedf;
--color-chocolate-truffle-200: #f4c8c9;
--color-chocolate-truffle-300: #dca8a9;
--color-chocolate-truffle-400: #c88c90;
--color-chocolate-truffle-500: #b47076;
--color-chocolate-truffle-600: #985f64;
--color-chocolate-truffle-700: #7a4c50;
--color-chocolate-truffle-800: #5a373b;
--color-chocolate-truffle-900: #3f2628;
--color-chocolate-truffle-950: #281416;
}SCSS
$chocolate-truffle: #663036;
$chocolate-truffle-rgb: 102, 48, 54;
$chocolate-truffle-light: mix(#fff, $chocolate-truffle, 20%);
$chocolate-truffle-dark: mix(#000, $chocolate-truffle, 20%);
.element {
color: $chocolate-truffle;
box-shadow: 0 0 0 2px rgba($chocolate-truffle, 0.35);
}