最も近い色名 · #37B053
#37B053
最も近い色名: Matt Green
#37B053（rgb(55 176 83)、hsl(134 52% 45%)、oklch(0.67 0.17 147.5)）に最も近い色名はMatt Greenです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#37B053
oklch(0.67 0.17 147.5)
カラー変換
- HEX
- #37b053
- RGB
- rgb(55 176 83)
- HSL
- hsl(134 52% 45%)
- HWB
- hwb(134 22% 31%)
- OKLCH
- oklch(0.67 0.17 147.5)
- OKLab
- oklab(0.67 -0.143 0.091)
- CIE Lab
- lab(63.75 -49.66 37.08)
- LCH
- lch(63.75 61.97 143.2)
- CMYK
- cmyk(69% 0% 53% 31%)
ティント · シェード · トーン
ティント
- 52B865
- 69C076
- 7EC988
- 91D199
- A4D9AA
- B6E0BA
- C9E8CB
- DBF0DD
- EDF7EE
シェード
- 2E9947
- 26823B
- 1E6C30
- 165625
- 0F421B
- 082E11
- 031C08
- 010B02
- 000100
トーン
- 45AB59
- 4FA75E
- 58A264
- 609E68
- 67996D
- 6D9471
- 728F75
- 778A79
- 7C857D
カラーハーモニー
補色 +180°
- 37B053
Matt Green
- CA6ACA
≈ Purple Urn Orchid
類似色 -30° +30°
- 37B053
Matt Green
- 8EA100
≈ Noxious
- 00AD94
≈ Hobgoblin
トライアド +120° +240°
- 37B053
Matt Green
- 678DFC
≈ Punch Out Glove
- EB6458
≈ Emberglow
スプリットコンプリメンタリー +150° +210°
- 37B053
Matt Green
- A27AEF
≈ Forgotten Purple
- E36195
≈ Carmine Rose
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.80:1 · APCA Lc 53
Ag
AAA黒の上
WCAG 7.49:1 · APCA Lc 48
最適な文字色: #000000
WCAG 7.49:1 (AAA) · APCA Lc 48
Contrast pairs
コードスニペット
CSS
:root {
--matt-green: #37b053;
--matt-green-rgb: 55 176 83;
--matt-green-oklch: oklch(0.67 0.17 147.5);
}
.element {
color: var(--matt-green);
background-color: hsl(134 52% 45%);
border-color: oklch(0.67 0.17 147.5);
}Tailwind CSS v4
@theme {
--color-matt-green: #37b053;
--color-matt-green-50: #d4ffdc;
--color-matt-green-100: #c0f8ca;
--color-matt-green-200: #9fe9ad;
--color-matt-green-300: #73cf87;
--color-matt-green-400: #4bb960;
--color-matt-green-500: #00a23a;
--color-matt-green-600: #008933;
--color-matt-green-700: #046e28;
--color-matt-green-800: #0b5118;
--color-matt-green-900: #07380f;
--color-matt-green-950: #002303;
}SCSS
$matt-green: #37b053;
$matt-green-rgb: 55, 176, 83;
$matt-green-light: mix(#fff, $matt-green, 20%);
$matt-green-dark: mix(#000, $matt-green, 20%);
.element {
color: $matt-green;
box-shadow: 0 0 0 2px rgba($matt-green, 0.35);
}