命名颜色 · #768083
Peak Point
Peak Point 即 #768083:rgb(118 128 131)、hsl(194 5% 49%)、oklch(0.593 0.013 217.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Peak Point color name →
#768083
oklch(0.593 0.013 217.6)
颜色转换
- HEX
- #768083
- RGB
- rgb(118 128 131)
- HSL
- hsl(194 5% 49%)
- HWB
- hwb(194 46% 49%)
- OKLCH
- oklch(0.593 0.013 217.6)
- OKLab
- oklab(0.593 -0.01 -0.008)
- CIE Lab
- lab(52.82 -3.35 -2.97)
- LCH
- lch(52.82 4.48 221.5)
- CMYK
- cmyk(10% 2% 0% 49%)
浅色调 · 深色调 · 灰色调
浅色调
- 838C8F
- 90989B
- 9DA4A7
- ABB1B3
- B8BEBF
- C6CACC
- D4D7D8
- E2E4E5
- F1F2F2
深色调
- 666E71
- 565D60
- 474D4F
- 383D3F
- 292E2F
- 1C1F20
- 0F1212
- 050606
- 010101
灰色调
- 778083
- 788082
- 798082
- 7A8082
- 7B8082
- 7C8081
- 7D8081
- 7E8081
- 7F8080
配色和谐
互补色 +180°
- 768083
Peak Point
- 857C79
≈ Eastlake Lavender
类似色 -30° +30°
- 768083
Peak Point
- 76817F
≈ Adrift at Sea
- 787F85
≈ Downing Slate
三角配色 +120° +240°
- 768083
Peak Point
- 837B81
≈ Magic Dust
- 807E76
≈ Fieldstone
分裂互补色 +150° +210°
- 768083
Peak Point
- 857B7C
≈ Sensuous Grey
- 837D76
≈ Chain Link
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 4.04:1 · APCA Lc 68
Ag
AA黑底
WCAG 5.18:1 · APCA Lc 34
最佳文字颜色: #000000
WCAG 5.18:1 (AA) · APCA Lc 34
Contrast pairs
代码片段
CSS
:root {
--peak-point: #768083;
--peak-point-rgb: 118 128 131;
--peak-point-oklch: oklch(0.593 0.013 217.6);
}
.element {
color: var(--peak-point);
background-color: hsl(194 5% 49%);
border-color: oklch(0.593 0.013 217.6);
}Tailwind CSS v4
@theme {
--color-peak-point: #768083;
--color-peak-point-50: #f1f6f8;
--color-peak-point-100: #e3e9eb;
--color-peak-point-200: #cfd6d8;
--color-peak-point-300: #b1b9bc;
--color-peak-point-400: #97a0a3;
--color-peak-point-500: #7d888c;
--color-peak-point-600: #6a7376;
--color-peak-point-700: #555c5f;
--color-peak-point-800: #3e4445;
--color-peak-point-900: #2a2f30;
--color-peak-point-950: #181b1c;
}SCSS
$peak-point: #768083;
$peak-point-rgb: 118, 128, 131;
$peak-point-light: mix(#fff, $peak-point, 20%);
$peak-point-dark: mix(#000, $peak-point, 20%);
.element {
color: $peak-point;
box-shadow: 0 0 0 2px rgba($peak-point, 0.35);
}