最接近的命名颜色 · #CC425F
#CC425F
最接近的命名颜色: Paper Hearts
#CC425F(rgb(204 66 95)、hsl(347 58% 53%)、oklch(0.582 0.174 12))最接近命名颜色 Paper Hearts。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#CC425F
oklch(0.582 0.174 12)
颜色转换
- HEX
- #cc425f
- RGB
- rgb(204 66 95)
- HSL
- hsl(347 58% 53%)
- HWB
- hwb(347 26% 20%)
- OKLCH
- oklch(0.582 0.174 12)
- OKLab
- oklab(0.582 0.17 0.036)
- CIE Lab
- lab(49.54 56.56 15.56)
- LCH
- lch(49.54 58.66 15.4)
- CMYK
- cmyk(0% 68% 53% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- D4586E
- DB6C7D
- E17F8C
- E7929C
- EDA4AC
- F2B6BC
- F6C8CD
- FADADD
- FDEDEE
深色调
- B13852
- 972F44
- 7E2538
- 651C2C
- 4E1420
- 370B15
- 22050A
- 0F0103
- 020000
灰色调
- C64B62
- BF5366
- B95B69
- B2616C
- AB6770
- A36D73
- 9B7276
- 93777A
- 8A7C7D
配色和谐
互补色 +180°
- CC425F
Paper Hearts
- 008D8A
≈ Corfu Shallows
类似色 -30° +30°
- CC425F
Paper Hearts
- BC4797
≈ Boat Orchid
- CB4D04
≈ Dark Orange
三角配色 +120° +240°
- CC425F
Paper Hearts
- 558D00
≈ Pistachio Flour
- 007CDD
≈ Soothing Sapphire
分裂互补色 +150° +210°
- CC425F
Paper Hearts
- 009263
≈ Emerald Lake
- 0088A8
≈ Hacienda Blue
四角配色 +90° +180° +270°
- CC425F
Paper Hearts
- 8A7D00
≈ Moscow Papyrus
- 008D8A
≈ Corfu Shallows
- 6E68DD
≈ Exodus Fruit
对比度与无障碍
Ag
AA白底
WCAG 4.65:1 · APCA Lc 71
Ag
AA黑底
WCAG 4.51:1 · APCA Lc 30
最佳文字颜色: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 71
Contrast pairs
代码片段
CSS
:root {
--paper-hearts: #cc425f;
--paper-hearts-rgb: 204 66 95;
--paper-hearts-oklch: oklch(0.582 0.174 12);
}
.element {
color: var(--paper-hearts);
background-color: hsl(347 58% 53%);
border-color: oklch(0.582 0.174 12);
}Tailwind CSS v4
@theme {
--color-paper-hearts: #cc425f;
--color-paper-hearts-50: #ffe2e6;
--color-paper-hearts-100: #ffd1d6;
--color-paper-hearts-200: #ffb5be;
--color-paper-hearts-300: #ff909c;
--color-paper-hearts-400: #f26c83;
--color-paper-hearts-500: #e04567;
--color-paper-hearts-600: #bd3c57;
--color-paper-hearts-700: #983046;
--color-paper-hearts-800: #712134;
--color-paper-hearts-900: #501624;
--color-paper-hearts-950: #350613;
}SCSS
$paper-hearts: #cc425f;
$paper-hearts-rgb: 204, 66, 95;
$paper-hearts-light: mix(#fff, $paper-hearts, 20%);
$paper-hearts-dark: mix(#000, $paper-hearts, 20%);
.element {
color: $paper-hearts;
box-shadow: 0 0 0 2px rgba($paper-hearts, 0.35);
}