最も近い色名 · #77B800
#77B800
最も近い色名: Jubilant Meadow
#77B800（rgb(119 184 0)、hsl(81 100% 36%)、oklch(0.711 0.193 130.4)）に最も近い色名はJubilant Meadowです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#77B800
oklch(0.711 0.193 130.4)
カラー変換
- HEX
- #77b800
- RGB
- rgb(119 184 0)
- HSL
- hsl(81 100% 36%)
- HWB
- hwb(81 0% 28%)
- OKLCH
- oklch(0.711 0.193 130.4)
- OKLab
- oklab(0.711 -0.125 0.147)
- CIE Lab
- lab(68.36 -38.54 67.37)
- LCH
- lch(68.36 77.61 119.8)
- CMYK
- cmyk(35% 0% 100% 28%)
ティント · シェード · トーン
ティント
- 84C03A
- 92C757
- 9FCE6F
- ADD685
- BADD9A
- C8E4AF
- D5EBC3
- E3F2D7
- F1F8EB
シェード
- 67A000
- 578800
- 477100
- 385B00
- 2A4500
- 1C3100
- 101E00
- 050C00
- 010200
トーン
- 78B329
- 7AAD3B
- 7BA849
- 7CA254
- 7D9D5D
- 7E9765
- 7E926D
- 7F8C74
- 80867A
カラーハーモニー
補色 +180°
- 77B800
Jubilant Meadow
- C779F9
≈ Rosy Fluffy Bedspread
類似色 -30° +30°
- 77B800
Jubilant Meadow
- B7A300
≈ Snakebite Leather
- 00BF7F
≈ Fennel Fiesta
トライアド +120° +240°
- 77B800
Jubilant Meadow
- 4BA6FF
≈ Joust Blue
- FF6686
≈ Berlin Pink
スプリットコンプリメンタリー +150° +210°
- 77B800
Jubilant Meadow
- 9194FF
≈ Periwinkle Blue
- ED69C6
≈ Crumbly Lipstick
テトラード +90° +180° +270°
- 77B800
Jubilant Meadow
- 00B4DA
≈ Blue Atoll
- C779F9
≈ Rosy Fluffy Bedspread
- FF7037
≈ Bright Orange
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.43:1 · APCA Lc 48
Ag
AAA黒の上
WCAG 8.64:1 · APCA Lc 54
最適な文字色: #000000
WCAG 8.64:1 (AAA) · APCA Lc 54
Contrast pairs
コードスニペット
CSS
:root {
--jubilant-meadow: #77b800;
--jubilant-meadow-rgb: 119 184 0;
--jubilant-meadow-oklch: oklch(0.711 0.193 130.4);
}
.element {
color: var(--jubilant-meadow);
background-color: hsl(81 100% 36%);
border-color: oklch(0.711 0.193 130.4);
}Tailwind CSS v4
@theme {
--color-jubilant-meadow: #77b800;
--color-jubilant-meadow-50: #e1ffc9;
--color-jubilant-meadow-100: #d0f6b3;
--color-jubilant-meadow-200: #b5e68f;
--color-jubilant-meadow-300: #91cc5e;
--color-jubilant-meadow-400: #76b418;
--color-jubilant-meadow-500: #579c00;
--color-jubilant-meadow-600: #4a8400;
--color-jubilant-meadow-700: #3b6a00;
--color-jubilant-meadow-800: #2e4d00;
--color-jubilant-meadow-900: #1f3600;
--color-jubilant-meadow-950: #0f2100;
}SCSS
$jubilant-meadow: #77b800;
$jubilant-meadow-rgb: 119, 184, 0;
$jubilant-meadow-light: mix(#fff, $jubilant-meadow, 20%);
$jubilant-meadow-dark: mix(#000, $jubilant-meadow, 20%);
.element {
color: $jubilant-meadow;
box-shadow: 0 0 0 2px rgba($jubilant-meadow, 0.35);
}