Màu có tên · #BF6C6E
Watermelon Crush
Watermelon Crush là #BF6C6E: rgb(191 108 110), hsl(359 39% 59%), oklch(0.625 0.106 19). 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.
What does Red mean? → · Watermelon Crush color name →
#BF6C6E
oklch(0.625 0.106 19)
Chuyển đổi màu
- HEX
- #bf6c6e
- RGB
- rgb(191 108 110)
- HSL
- hsl(359 39% 59%)
- HWB
- hwb(359 42% 25%)
- OKLCH
- oklch(0.625 0.106 19)
- OKLab
- oklab(0.625 0.1 0.034)
- CIE Lab
- lab(55.37 33.89 14.16)
- LCH
- lch(55.37 36.73 22.7)
- CMYK
- cmyk(0% 43% 42% 25%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- C77B7C
- CE8989
- D59898
- DCA6A6
- E2B5B4
- E8C3C3
- EED2D2
- F4E1E1
- FAF0F0
Sắc đậm
- A65D5F
- 8D4E50
- 754041
- 5E3233
- 482526
- 331919
- 1F0D0E
- 0D0404
- 020001
Sắc xám
- B96F70
- B37172
- AE7374
- A87575
- A17777
- 9B7979
- 957B7B
- 8E7D7D
- 877E7E
Hòa sắc
Bổ túc +180°
- BF6C6E
Watermelon Crush
- 039AA0
≈ Riviera Paradise
Tương đồng -30° +30°
- BF6C6E
Watermelon Crush
- B76C92
≈ Fuscia Fizz
- BB734B
≈ Orange Lily
Bộ ba +120° +240°
- BF6C6E
Watermelon Crush
- 659758
≈ Abundance
- 6088C7
≈ Marina
Bổ túc chia +150° +210°
- BF6C6E
Watermelon Crush
- 359C7D
≈ Green Jelly
- 3193BA
≈ Spa Dream
Bộ bốn +90° +180° +270°
- BF6C6E
Watermelon Crush
- 8D8D39
≈ Sycamore
- 039AA0
≈ Riviera Paradise
- 867CC3
≈ Ube
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 3.75:1 · APCA Lc 65
Ag
AATrên nền đen
WCAG 5.58:1 · APCA Lc 37
Màu chữ tốt nhất: #000000
WCAG 5.58:1 (AA) · APCA Lc 37
Contrast pairs
Đoạn mã
CSS
:root {
--watermelon-crush: #bf6c6e;
--watermelon-crush-rgb: 191 108 110;
--watermelon-crush-oklch: oklch(0.625 0.106 19);
}
.element {
color: var(--watermelon-crush);
background-color: hsl(359 39% 59%);
border-color: oklch(0.625 0.106 19);
}Tailwind CSS v4
@theme {
--color-watermelon-crush: #bf6c6e;
--color-watermelon-crush-50: #ffeae8;
--color-watermelon-crush-100: #ffdbd9;
--color-watermelon-crush-200: #ffc3c1;
--color-watermelon-crush-300: #e9a2a0;
--color-watermelon-crush-400: #d68486;
--color-watermelon-crush-500: #c2676a;
--color-watermelon-crush-600: #a4585a;
--color-watermelon-crush-700: #844648;
--color-watermelon-crush-800: #623235;
--color-watermelon-crush-900: #452224;
--color-watermelon-crush-950: #2c1113;
}SCSS
$watermelon-crush: #bf6c6e;
$watermelon-crush-rgb: 191, 108, 110;
$watermelon-crush-light: mix(#fff, $watermelon-crush, 20%);
$watermelon-crush-dark: mix(#000, $watermelon-crush, 20%);
.element {
color: $watermelon-crush;
box-shadow: 0 0 0 2px rgba($watermelon-crush, 0.35);
}