命名颜色 · #E3A9A2
Coral Fountain
Coral Fountain 即 #E3A9A2：rgb(227 169 162)、hsl(6 54% 76%)、oklch(0.787 0.07 26.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Coral Fountain color name →
#E3A9A2
oklch(0.787 0.07 26.6)
颜色转换
- HEX
- #e3a9a2
- RGB
- rgb(227 169 162)
- HSL
- hsl(6 54% 76%)
- HWB
- hwb(6 64% 11%)
- OKLCH
- oklch(0.787 0.07 26.6)
- OKLab
- oklab(0.787 0.062 0.031)
- CIE Lab
- lab(74.65 21.26 12.41)
- LCH
- lch(74.65 24.62 30.3)
- CMYK
- cmyk(0% 26% 29% 11%)
浅色调 · 深色调 · 灰色调
浅色调
- E6B2AB
- E9BAB4
- EDC3BD
- EFCBC6
- F2D4D0
- F5DCD9
- F8E5E2
- FAEEEC
- FDF6F5
深色调
- C5928C
- A87C77
- 8C6763
- 71534F
- 573F3C
- 3F2C2A
- 271B19
- 120A0A
- 030101
灰色调
- D9A59F
- CFA19B
- C59D98
- BB9994
- B19591
- A7918E
- 9D8C8A
- 948887
- 8A8483
配色和谐
互补色 +180°
- E3A9A2
Coral Fountain
- 83C7D0
≈ Not a Cloud in Sight
类似色 -30° +30°
- E3A9A2
Coral Fountain
- DFA8BA
≈ Apple Infusion
- DDAF8E
≈ Boot Hill Ghost
三角配色 +120° +240°
- E3A9A2
Coral Fountain
- 9DC6A0
≈ French Market
- A5B9E7
≈ Teclis Blue
分裂互补色 +150° +210°
- E3A9A2
Coral Fountain
- 89C9B8
≈ Aquastone
- 8FC1E1
≈ Moment of Grace
四角配色 +90° +180° +270°
- E3A9A2
Coral Fountain
- B6C08D
≈ Jitterbug
- 83C7D0
≈ Not a Cloud in Sight
- BDB1E2
≈ Moonraker
对比度与无障碍
Ag
Fail白底
WCAG 2.00:1 · APCA Lc 39
Ag
AAA黑底
WCAG 10.46:1 · APCA Lc 64
最佳文字颜色: #000000
WCAG 10.46:1 (AAA) · APCA Lc 64
Contrast pairs
代码片段
CSS
:root {
--coral-fountain: #e3a9a2;
--coral-fountain-rgb: 227 169 162;
--coral-fountain-oklch: oklch(0.787 0.07 26.6);
}
.element {
color: var(--coral-fountain);
background-color: hsl(6 54% 76%);
border-color: oklch(0.787 0.07 26.6);
}Tailwind CSS v4
@theme {
--color-coral-fountain: #e3a9a2;
--color-coral-fountain-50: #ffeeea;
--color-coral-fountain-100: #ffe0db;
--color-coral-fountain-200: #f1cac4;
--color-coral-fountain-300: #d9aba3;
--color-coral-fountain-400: #c48f89;
--color-coral-fountain-500: #b0746d;
--color-coral-fountain-600: #95635d;
--color-coral-fountain-700: #774f4a;
--color-coral-fountain-800: #583936;
--color-coral-fountain-900: #3e2725;
--color-coral-fountain-950: #271514;
}SCSS
$coral-fountain: #e3a9a2;
$coral-fountain-rgb: 227, 169, 162;
$coral-fountain-light: mix(#fff, $coral-fountain, 20%);
$coral-fountain-dark: mix(#000, $coral-fountain, 20%);
.element {
color: $coral-fountain;
box-shadow: 0 0 0 2px rgba($coral-fountain, 0.35);
}