色名 · #87A96B
Peeled Asparagus
Peeled Asparagusは#87A96B：rgb(135 169 107)、hsl(93 26% 54%)、oklch(0.694 0.094 131.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Peeled Asparagus color name →
#87A96B
oklch(0.694 0.094 131.8)
カラー変換
- HEX
- #87a96b
- RGB
- rgb(135 169 107)
- HSL
- hsl(93 26% 54%)
- HWB
- hwb(93 42% 34%)
- OKLCH
- oklch(0.694 0.094 131.8)
- OKLab
- oklab(0.694 -0.063 0.07)
- CIE Lab
- lab(65.53 -20.54 28.07)
- LCH
- lch(65.53 34.78 126.2)
- CMYK
- cmyk(20% 0% 37% 34%)
ティント · シェード · トーン
ティント
- 93B27A
- 9EBA88
- AAC397
- B6CBA6
- C2D4B4
- CEDCC3
- DAE5D2
- E6EEE1
- F3F6F0
シェード
- 75925C
- 637C4E
- 51673F
- 415332
- 313F25
- 212C18
- 131B0D
- 060A04
- 010100
トーン
- 86A56E
- 86A170
- 859D73
- 849975
- 849577
- 839179
- 828C7B
- 82887D
- 81847E
カラーハーモニー
補色 +180°
- 87A96B
Peeled Asparagus
- B08CC7
≈ Creeping Bellflower
類似色 -30° +30°
- 87A96B
Peeled Asparagus
- A89F57
≈ Organic Matter
- 63AF8A
≈ Verdigris Green
トライアド +120° +240°
- 87A96B
Peeled Asparagus
- 71A0D5
≈ Kindred
- D0848D
≈ Rose Sachet
スプリットコンプリメンタリー +150° +210°
- 87A96B
Peeled Asparagus
- 9395D6
≈ Portage
- C585AD
≈ Moonlight Mauve
テトラード +90° +180° +270°
- 87A96B
Peeled Asparagus
- 51AAC6
≈ Estero Sky
- B08CC7
≈ Creeping Bellflower
- CE896E
≈ Subdued Sienna
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.65:1 · APCA Lc 52
Ag
AAA黒の上
WCAG 7.91:1 · APCA Lc 50
最適な文字色: #000000
WCAG 7.91:1 (AAA) · APCA Lc 50
Contrast pairs
コードスニペット
CSS
:root {
--peeled-asparagus: #87a96b;
--peeled-asparagus-rgb: 135 169 107;
--peeled-asparagus-oklch: oklch(0.694 0.094 131.8);
}
.element {
color: var(--peeled-asparagus);
background-color: hsl(93 26% 54%);
border-color: oklch(0.694 0.094 131.8);
}Tailwind CSS v4
@theme {
--color-peeled-asparagus: #87a96b;
--color-peeled-asparagus-50: #eafce0;
--color-peeled-asparagus-100: #dbefd0;
--color-peeled-asparagus-200: #c4deb5;
--color-peeled-asparagus-300: #a4c291;
--color-peeled-asparagus-400: #8aaa70;
--color-peeled-asparagus-500: #6f934f;
--color-peeled-asparagus-600: #5e7c44;
--color-peeled-asparagus-700: #4b6436;
--color-peeled-asparagus-800: #384925;
--color-peeled-asparagus-900: #263318;
--color-peeled-asparagus-950: #141e09;
}SCSS
$peeled-asparagus: #87a96b;
$peeled-asparagus-rgb: 135, 169, 107;
$peeled-asparagus-light: mix(#fff, $peeled-asparagus, 20%);
$peeled-asparagus-dark: mix(#000, $peeled-asparagus, 20%);
.element {
color: $peeled-asparagus;
box-shadow: 0 0 0 2px rgba($peeled-asparagus, 0.35);
}