最接近的命名颜色 · #697792
#697792
最接近的命名颜色: Infinity and Beyond
#697792(rgb(105 119 146)、hsl(220 16% 49%)、oklch(0.568 0.045 263.4))最接近命名颜色 Infinity and Beyond。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#697792
oklch(0.568 0.045 263.4)
颜色转换
- HEX
- #697792
- RGB
- rgb(105 119 146)
- HSL
- hsl(220 16% 49%)
- HWB
- hwb(220 41% 43%)
- OKLCH
- oklch(0.568 0.045 263.4)
- OKLab
- oklab(0.568 -0.005 -0.045)
- CIE Lab
- lab(49.63 -0.46 -16.57)
- LCH
- lch(49.63 16.57 268.4)
- CMYK
- cmyk(28% 18% 0% 43%)
浅色调 · 深色调 · 灰色调
浅色调
- 77849D
- 8591A7
- 949EB2
- A2ABBD
- B1B9C8
- C0C7D3
- D0D4DE
- DFE2E9
- EFF1F4
深色调
- 5A677E
- 4C576B
- 3E4758
- 313846
- 242A35
- 181C25
- 0C1016
- 040508
- 000101
灰色调
- 6B7890
- 6E798F
- 707A8D
- 727B8B
- 757C89
- 777D87
- 797D86
- 7B7E84
- 7E7F82
配色和谐
互补色 +180°
- 697792
Infinity and Beyond
- 847558
≈ Gothic Olive
类似色 -30° +30°
- 697792
Infinity and Beyond
- 5C7C8D
≈ Providence
- 78728F
≈ Capercaillie Mauve
三角配色 +120° +240°
- 697792
Infinity and Beyond
- 906D6A
≈ Moss Rose
- 677E66
≈ Emerald City
分裂互补色 +150° +210°
- 697792
Infinity and Beyond
- 8D705E
≈ Nuthatch
- 767A5B
≈ Loden Green
四角配色 +90° +180° +270°
- 697792
Infinity and Beyond
- 8D6C79
≈ Blunt Violet
- 847558
≈ Gothic Olive
- 5B8074
≈ Trellis Vine
对比度与无障碍
Ag
AA白底
WCAG 4.51:1 · APCA Lc 71
Ag
AA黑底
WCAG 4.65:1 · APCA Lc 30
最佳文字颜色: #000000
WCAG 4.65:1 (AA) · APCA Lc 30
Contrast pairs
代码片段
CSS
:root {
--infinity-and-beyond: #697792;
--infinity-and-beyond-rgb: 105 119 146;
--infinity-and-beyond-oklch: oklch(0.568 0.045 263.4);
}
.element {
color: var(--infinity-and-beyond);
background-color: hsl(220 16% 49%);
border-color: oklch(0.568 0.045 263.4);
}Tailwind CSS v4
@theme {
--color-infinity-and-beyond: #697792;
--color-infinity-and-beyond-50: #eff5ff;
--color-infinity-and-beyond-100: #e1e8f8;
--color-infinity-and-beyond-200: #cbd4e8;
--color-infinity-and-beyond-300: #acb8cf;
--color-infinity-and-beyond-400: #919fba;
--color-infinity-and-beyond-500: #7786a5;
--color-infinity-and-beyond-600: #65728b;
--color-infinity-and-beyond-700: #505b70;
--color-infinity-and-beyond-800: #3a4352;
--color-infinity-and-beyond-900: #282e39;
--color-infinity-and-beyond-950: #161b24;
}SCSS
$infinity-and-beyond: #697792;
$infinity-and-beyond-rgb: 105, 119, 146;
$infinity-and-beyond-light: mix(#fff, $infinity-and-beyond, 20%);
$infinity-and-beyond-dark: mix(#000, $infinity-and-beyond, 20%);
.element {
color: $infinity-and-beyond;
box-shadow: 0 0 0 2px rgba($infinity-and-beyond, 0.35);
}