色名 · #466353
Cucumber Green
Cucumber Greenは#466353：rgb(70 99 83)、hsl(147 17% 33%)、oklch(0.472 0.043 160)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Cucumber Green color name →
#466353
oklch(0.472 0.043 160)
カラー変換
- HEX
- #466353
- RGB
- rgb(70 99 83)
- HSL
- hsl(147 17% 33%)
- HWB
- hwb(147 27% 61%)
- OKLCH
- oklch(0.472 0.043 160)
- OKLab
- oklab(0.472 -0.04 0.015)
- CIE Lab
- lab(39.3 -13.97 5.52)
- LCH
- lch(39.3 15.02 158.4)
- CMYK
- cmyk(29% 0% 16% 61%)
ティント · シェード · トーン
ティント
- 577163
- 688073
- 7A8F83
- 8C9E94
- 9FAEA5
- B1BEB6
- C4CEC8
- D8DEDA
- EBEEEC
シェード
- 3C5547
- 32473B
- 283A30
- 1E2E25
- 15211B
- 0D1611
- 050B08
- 020302
- 000000
トーン
- 4C6657
- 52695C
- 586C60
- 5D6F65
- 637269
- 69746E
- 6F7772
- 747A77
- 7A7D7B
カラーハーモニー
補色 +180°
- 466353
Cucumber Green
- 6C5263
≈ Dynamic
類似色 -30° +30°
- 466353
Cucumber Green
- 536047
≈ Mossy Bronze
- 3E6361
≈ Moor Pond Green
トライアド +120° +240°
- 466353
Cucumber Green
- 565973
≈ Nightshadow Blue
- 715349
≈ Afternoon Coffee
スプリットコンプリメンタリー +150° +210°
- 466353
Cucumber Green
- 63556E
≈ Rich Texture
- 715156
≈ Night Romance
テトラード +90° +180° +270°
- 466353
Cucumber Green
- 495D73
≈ Mountain River
- 6C5263
≈ Dynamic
- 6B5741
≈ Burley Wood
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.62:1 · APCA Lc 83
Ag
Fail黒の上
WCAG 3.17:1 · APCA Lc 19
最適な文字色: #FFFFFF
WCAG 6.62:1 (AA) · APCA Lc 83
Contrast pairs
コードスニペット
CSS
:root {
--cucumber-green: #466353;
--cucumber-green-rgb: 70 99 83;
--cucumber-green-oklch: oklch(0.472 0.043 160);
}
.element {
color: var(--cucumber-green);
background-color: hsl(147 17% 33%);
border-color: oklch(0.472 0.043 160);
}Tailwind CSS v4
@theme {
--color-cucumber-green: #466353;
--color-cucumber-green-50: #ebf9f1;
--color-cucumber-green-100: #dcede3;
--color-cucumber-green-200: #c5dacf;
--color-cucumber-green-300: #a5bfb1;
--color-cucumber-green-400: #89a796;
--color-cucumber-green-500: #6e8f7c;
--color-cucumber-green-600: #5d7969;
--color-cucumber-green-700: #4a6154;
--color-cucumber-green-800: #36473d;
--color-cucumber-green-900: #25312a;
--color-cucumber-green-950: #131d17;
}SCSS
$cucumber-green: #466353;
$cucumber-green-rgb: 70, 99, 83;
$cucumber-green-light: mix(#fff, $cucumber-green, 20%);
$cucumber-green-dark: mix(#000, $cucumber-green, 20%);
.element {
color: $cucumber-green;
box-shadow: 0 0 0 2px rgba($cucumber-green, 0.35);
}