最接近的命名颜色 · #1D8847
#1D8847
最接近的命名颜色: Later Gator
#1D8847(rgb(29 136 71)、hsl(144 65% 32%)、oklch(0.553 0.136 151.4))最接近命名颜色 Later Gator。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#1D8847
oklch(0.553 0.136 151.4)
颜色转换
- HEX
- #1d8847
- RGB
- rgb(29 136 71)
- HSL
- hsl(144 65% 32%)
- HWB
- hwb(144 11% 47%)
- OKLCH
- oklch(0.553 0.136 151.4)
- OKLab
- oklab(0.553 -0.12 0.065)
- CIE Lab
- lab(49.86 -42 26.07)
- LCH
- lch(49.86 49.43 148.2)
- CMYK
- cmyk(79% 0% 48% 47%)
浅色调 · 深色调 · 灰色调
浅色调
- 3D9459
- 56A06B
- 6CAC7C
- 82B78E
- 97C3A1
- ABCFB3
- C0DBC6
- D5E7D9
- EAF3EC
深色调
- 18753D
- 136332
- 0E5228
- 09411F
- 053116
- 03220D
- 011306
- 000602
- 000100
灰色调
- 30884D
- 3D8754
- 488659
- 52865F
- 5B8565
- 63846A
- 6B8370
- 728275
- 79817B
配色和谐
互补色 +180°
- 1D8847
Later Gator
- 9E5196
≈ Hyacinth Violet
类似色 -30° +30°
- 1D8847
Later Gator
- 677D00
≈ Birch Leaf Green
- 008576
≈ Summer Turquoise
三角配色 +120° +240°
- 1D8847
Later Gator
- 566BC1
≈ Amparo Blue
- B44E3D
≈ Burnt Brick
分裂互补色 +150° +210°
- 1D8847
Later Gator
- 815CB4
≈ Lusty Lavender
- B04B6D
≈ Lickedy Lick
四角配色 +90° +180° +270°
- 1D8847
Later Gator
- 007AB7
≈ Star Command Blue
- 9E5196
≈ Hyacinth Violet
- A65E00
≈ Raw Umber
对比度与无障碍
Ag
AA白底
WCAG 4.50:1 · APCA Lc 71
Ag
AA黑底
WCAG 4.66:1 · APCA Lc 31
最佳文字颜色: #000000
WCAG 4.66:1 (AA) · APCA Lc 31
Contrast pairs
代码片段
CSS
:root {
--later-gator: #1d8847;
--later-gator-rgb: 29 136 71;
--later-gator-oklch: oklch(0.553 0.136 151.4);
}
.element {
color: var(--later-gator);
background-color: hsl(144 65% 32%);
border-color: oklch(0.553 0.136 151.4);
}Tailwind CSS v4
@theme {
--color-later-gator: #1d8847;
--color-later-gator-50: #d8ffe3;
--color-later-gator-100: #c6f6d3;
--color-later-gator-200: #a7e6b9;
--color-later-gator-300: #7ecc97;
--color-later-gator-400: #59b574;
--color-later-gator-500: #289f55;
--color-later-gator-600: #258649;
--color-later-gator-700: #1e6c3a;
--color-later-gator-800: #174f27;
--color-later-gator-900: #0f371a;
--color-later-gator-950: #02220a;
}SCSS
$later-gator: #1d8847;
$later-gator-rgb: 29, 136, 71;
$later-gator-light: mix(#fff, $later-gator, 20%);
$later-gator-dark: mix(#000, $later-gator, 20%);
.element {
color: $later-gator;
box-shadow: 0 0 0 2px rgba($later-gator, 0.35);
}