色名 · #C5CD40
Sunny Green
Sunny Greenは#C5CD40：rgb(197 205 64)、hsl(63 59% 53%)、oklch(0.817 0.159 112.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Sunny Green color name →
#C5CD40
oklch(0.817 0.159 112.6)
カラー変換
- HEX
- #c5cd40
- RGB
- rgb(197 205 64)
- HSL
- hsl(63 59% 53%)
- HWB
- hwb(63 25% 20%)
- OKLCH
- oklch(0.817 0.159 112.6)
- OKLab
- oklab(0.817 -0.061 0.147)
- CIE Lab
- lab(79.9 -15.46 65.17)
- LCH
- lch(79.9 66.98 103.3)
- CMYK
- cmyk(4% 0% 69% 20%)
ティント · シェード · トーン
ティント
- CAD25B
- D0D871
- D5DD85
- DBE298
- E1E7AA
- E7ECBB
- EDF1CD
- F3F6DE
- F9FAEE
シェード
- ABB236
- 92982D
- 797E24
- 61661B
- 4B4E13
- 35380B
- 212305
- 0E0F01
- 020200
トーン
- BEC54D
- B6BE57
- AFB65F
- A8AE66
- A1A76C
- 9A9F71
- 949776
- 8D8F7A
- 86887D
カラーハーモニー
補色 +180°
- C5CD40
Sunny Green
- C5B7FF
≈ Violet Heaven
類似色 -30° +30°
- C5CD40
Sunny Green
- F5B828
≈ Yellow Groove
- 82DD7B
≈ Pastel Green
トライアド +120° +240°
- C5CD40
Sunny Green
- 73D0FF
≈ Bubbly Barracuda
- FFA2CA
≈ Bazooka Pink
スプリットコンプリメンタリー +150° +210°
- C5CD40
Sunny Green
- A4C4FF
≈ Pastel Blue
- F39EFF
≈ Party Pig
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.72:1 · APCA Lc 31
Ag
AAA黒の上
WCAG 12.18:1 · APCA Lc 72
最適な文字色: #000000
WCAG 12.18:1 (AAA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--sunny-green: #c5cd40;
--sunny-green-rgb: 197 205 64;
--sunny-green-oklch: oklch(0.817 0.159 112.6);
}
.element {
color: var(--sunny-green);
background-color: hsl(63 59% 53%);
border-color: oklch(0.817 0.159 112.6);
}Tailwind CSS v4
@theme {
--color-sunny-green: #c5cd40;
--color-sunny-green-50: #f3fbc7;
--color-sunny-green-100: #e6efb2;
--color-sunny-green-200: #d2dd8c;
--color-sunny-green-300: #b5c15b;
--color-sunny-green-400: #a0a715;
--color-sunny-green-500: #898f00;
--color-sunny-green-600: #747900;
--color-sunny-green-700: #5d6100;
--color-sunny-green-800: #464600;
--color-sunny-green-900: #303100;
--color-sunny-green-950: #1d1d00;
}SCSS
$sunny-green: #c5cd40;
$sunny-green-rgb: 197, 205, 64;
$sunny-green-light: mix(#fff, $sunny-green, 20%);
$sunny-green-dark: mix(#000, $sunny-green, 20%);
.element {
color: $sunny-green;
box-shadow: 0 0 0 2px rgba($sunny-green, 0.35);
}