色名 · #445533
Zen Garden Olive
Zen Garden Oliveは#445533：rgb(68 85 51)、hsl(90 25% 27%)、oklch(0.426 0.057 130.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Zen Garden Olive color name →
#445533
oklch(0.426 0.057 130.1)
カラー変換
- HEX
- #445533
- RGB
- rgb(68 85 51)
- HSL
- hsl(90 25% 27%)
- HWB
- hwb(90 20% 67%)
- OKLCH
- oklch(0.426 0.057 130.1)
- OKLab
- oklab(0.426 -0.037 0.044)
- CIE Lab
- lab(33.98 -12.02 17.6)
- LCH
- lch(33.98 21.31 124.3)
- CMYK
- cmyk(20% 0% 40% 67%)
ティント · シェード · トーン
ティント
- 556545
- 667458
- 78856C
- 8A957F
- 9CA694
- AFB7A8
- C3C9BD
- D7DBD3
- EBEDE9
シェード
- 3A492B
- 303D23
- 26311C
- 1D2614
- 141C0D
- 0C1107
- 050803
- 020201
- 000000
トーン
- 4A593B
- 505E42
- 55624A
- 5B6652
- 616A59
- 676F61
- 6D7369
- 747770
- 7A7C78
カラーハーモニー
補色 +180°
- 445533
Zen Garden Olive
- 584666
≈ Woad Purple
類似色 -30° +30°
- 445533
Zen Garden Olive
- 564F29
≈ Bronze Olive
- 305844
≈ Billiard Green
トライアド +120° +240°
- 445533
Zen Garden Olive
- 36516D
≈ Police Blue
- 6A4147
≈ Purplish Brown
スプリットコンプリメンタリー +150° +210°
- 445533
Zen Garden Olive
- 484B6E
≈ Royal Hyacinth
- 644258
≈ Delicious Berry
テトラード +90° +180° +270°
- 445533
Zen Garden Olive
- 255664
≈ Glitch
- 584666
≈ Woad Purple
- 6A4436
≈ Rugged Brown
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.09:1 · APCA Lc 88
Ag
Fail黒の上
WCAG 2.59:1 · APCA Lc 14
最適な文字色: #FFFFFF
WCAG 8.09:1 (AAA) · APCA Lc 88
Contrast pairs
コードスニペット
CSS
:root {
--zen-garden-olive: #445533;
--zen-garden-olive-rgb: 68 85 51;
--zen-garden-olive-oklch: oklch(0.426 0.057 130.1);
}
.element {
color: var(--zen-garden-olive);
background-color: hsl(90 25% 27%);
border-color: oklch(0.426 0.057 130.1);
}Tailwind CSS v4
@theme {
--color-zen-garden-olive: #445533;
--color-zen-garden-olive-50: #eff9e8;
--color-zen-garden-olive-100: #e1ecd9;
--color-zen-garden-olive-200: #cbdac1;
--color-zen-garden-olive-300: #adbea0;
--color-zen-garden-olive-400: #93a682;
--color-zen-garden-olive-500: #798e66;
--color-zen-garden-olive-600: #677857;
--color-zen-garden-olive-700: #526045;
--color-zen-garden-olive-800: #3c4631;
--color-zen-garden-olive-900: #2a3121;
--color-zen-garden-olive-950: #171d11;
}SCSS
$zen-garden-olive: #445533;
$zen-garden-olive-rgb: 68, 85, 51;
$zen-garden-olive-light: mix(#fff, $zen-garden-olive, 20%);
$zen-garden-olive-dark: mix(#000, $zen-garden-olive, 20%);
.element {
color: $zen-garden-olive;
box-shadow: 0 0 0 2px rgba($zen-garden-olive, 0.35);
}