最も近い色名 · #649373
#649373
最も近い色名: Paying Mantis
#649373(rgb(100 147 115)、hsl(139 19% 48%)、oklch(0.62 0.07 154.2))に最も近い色名はPaying Mantisです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#649373
oklch(0.62 0.07 154.2)
カラー変換
- HEX
- #649373
- RGB
- rgb(100 147 115)
- HSL
- hsl(139 19% 48%)
- HWB
- hwb(139 39% 42%)
- OKLCH
- oklch(0.62 0.07 154.2)
- OKLab
- oklab(0.62 -0.063 0.031)
- CIE Lab
- lab(56.87 -21.89 11.71)
- LCH
- lch(56.87 24.83 151.9)
- CMYK
- cmyk(32% 0% 22% 42%)
ティント · シェード · トーン
ティント
- 739D80
- 82A88E
- 92B39B
- A1BDA9
- B0C8B7
- C0D3C5
- CFDED3
- DFE9E2
- EFF4F0
シェード
- 567F63
- 486C54
- 3B5945
- 2E4736
- 223628
- 16251B
- 0B160F
- 030805
- 000101
トーン
- 679174
- 6B8F76
- 6E8D77
- 718C78
- 738A7A
- 76887B
- 79867C
- 7B847E
- 7E827F
カラーハーモニー
補色 +180°
- 649373
Paying Mantis
- A17698
≈ Screen Gem
類似色 -30° +30°
- 649373
Paying Mantis
- 7D8E5E
≈ Moss Point Green
- 51948B
≈ Martian Cerulean
トライアド +120° +240°
- 649373
Paying Mantis
- 7983B1
≈ Corsican Purple
- AC776A
≈ Sawshark
スプリットコンプリメンタリー +150° +210°
- 649373
Paying Mantis
- 8F7CA9
≈ Trumpeter
- AB7481
≈ French Marron
テトラード +90° +180° +270°
- 649373
Paying Mantis
- 618BAE
≈ Gunjō Blue
- A17698
≈ Screen Gem
- A47D59
≈ Cinnamon Crunch
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.52:1 · APCA Lc 63
Ag
AA黒の上
WCAG 5.96:1 · APCA Lc 39
最適な文字色: #000000
WCAG 5.96:1 (AA) · APCA Lc 39
Contrast pairs
コードスニペット
CSS
:root {
--paying-mantis: #649373;
--paying-mantis-rgb: 100 147 115;
--paying-mantis-oklch: oklch(0.62 0.07 154.2);
}
.element {
color: var(--paying-mantis);
background-color: hsl(139 19% 48%);
border-color: oklch(0.62 0.07 154.2);
}Tailwind CSS v4
@theme {
--color-paying-mantis: #649373;
--color-paying-mantis-50: #e6fced;
--color-paying-mantis-100: #d6efde;
--color-paying-mantis-200: #bddec8;
--color-paying-mantis-300: #9bc3a9;
--color-paying-mantis-400: #7eab8c;
--color-paying-mantis-500: #609471;
--color-paying-mantis-600: #527d60;
--color-paying-mantis-700: #41644c;
--color-paying-mantis-800: #2f4a36;
--color-paying-mantis-900: #203325;
--color-paying-mantis-950: #0f1f14;
}SCSS
$paying-mantis: #649373;
$paying-mantis-rgb: 100, 147, 115;
$paying-mantis-light: mix(#fff, $paying-mantis, 20%);
$paying-mantis-dark: mix(#000, $paying-mantis, 20%);
.element {
color: $paying-mantis;
box-shadow: 0 0 0 2px rgba($paying-mantis, 0.35);
}