最接近的命名颜色 · #F5B8A6
#F5B8A6
最接近的命名颜色: Wax Flower
#F5B8A6（rgb(245 184 166)、hsl(14 80% 81%)、oklch(0.834 0.076 37.1)）最接近命名颜色 Wax Flower。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#F5B8A6
oklch(0.834 0.076 37.1)
颜色转换
- HEX
- #f5b8a6
- RGB
- rgb(245 184 166)
- HSL
- hsl(14 80% 81%)
- HWB
- hwb(14 65% 4%)
- OKLCH
- oklch(0.834 0.076 37.1)
- OKLab
- oklab(0.834 0.06 0.046)
- CIE Lab
- lab(80.17 20.99 18.23)
- LCH
- lch(80.17 27.81 41)
- CMYK
- cmyk(0% 25% 32% 4%)
浅色调 · 深色调 · 灰色调
浅色调
- F6BFAF
- F8C6B8
- F9CDC0
- FAD4C9
- FBDCD2
- FCE3DB
- FDEAE4
- FEF1ED
- FFF8F6
深色调
- D5A090
- B6887A
- 987165
- 7B5B51
- 5F453E
- 44312B
- 2B1E1A
- 150C0A
- 030201
灰色调
- E9B2A2
- DDAD9E
- D1A79B
- C5A297
- BA9C93
- AE968F
- A3918C
- 978B88
- 8B8684
配色和谐
互补色 +180°
- F5B8A6
Wax Flower
- 8FD5E9
≈ Infinity Pool
类似色 -30° +30°
- F5B8A6
Wax Flower
- F5B5C0
≈ Squid Pink
- EAC094
≈ Apple Turnover
三角配色 +120° +240°
- F5B8A6
Wax Flower
- A0D8B5
≈ Nihilakh Oxide
- BCC5FA
≈ Light Periwinkle
分裂互补色 +150° +210°
- F5B8A6
Wax Flower
- 8ED9D1
≈ Island Breeze
- A1CEF8
≈ Baby Blue
四角配色 +90° +180° +270°
- F5B8A6
Wax Flower
- BBD29D
≈ Fava Bean
- 8FD5E9
≈ Infinity Pool
- D5BCF0
≈ Connecticut Lilac
对比度与无障碍
Ag
Fail白底
WCAG 1.70:1 · APCA Lc 31
Ag
AAA黑底
WCAG 12.28:1 · APCA Lc 72
最佳文字颜色: #000000
WCAG 12.28:1 (AAA) · APCA Lc 72
Contrast pairs
代码片段
CSS
:root {
--wax-flower: #f5b8a6;
--wax-flower-rgb: 245 184 166;
--wax-flower-oklch: oklch(0.834 0.076 37.1);
}
.element {
color: var(--wax-flower);
background-color: hsl(14 80% 81%);
border-color: oklch(0.834 0.076 37.1);
}Tailwind CSS v4
@theme {
--color-wax-flower: #f5b8a6;
--color-wax-flower-50: #ffeee6;
--color-wax-flower-100: #ffe0d6;
--color-wax-flower-200: #f2cabd;
--color-wax-flower-300: #daab9b;
--color-wax-flower-400: #c68f7f;
--color-wax-flower-500: #b27462;
--color-wax-flower-600: #966353;
--color-wax-flower-700: #794f42;
--color-wax-flower-800: #593930;
--color-wax-flower-900: #3f2721;
--color-wax-flower-950: #281510;
}SCSS
$wax-flower: #f5b8a6;
$wax-flower-rgb: 245, 184, 166;
$wax-flower-light: mix(#fff, $wax-flower, 20%);
$wax-flower-dark: mix(#000, $wax-flower, 20%);
.element {
color: $wax-flower;
box-shadow: 0 0 0 2px rgba($wax-flower, 0.35);
}