色名 · #B2E191
Sage Sensation
Sage Sensationは#B2E191：rgb(178 225 145)、hsl(95 57% 73%)、oklch(0.858 0.117 133.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Sage Sensation color name →
#B2E191
oklch(0.858 0.117 133.1)
カラー変換
- HEX
- #b2e191
- RGB
- rgb(178 225 145)
- HSL
- hsl(95 57% 73%)
- HWB
- hwb(95 57% 12%)
- OKLCH
- oklch(0.858 0.117 133.1)
- OKLab
- oklab(0.858 -0.08 0.085)
- CIE Lab
- lab(84.79 -26.26 34.03)
- LCH
- lch(84.79 42.99 127.7)
- CMYK
- cmyk(21% 0% 36% 12%)
ティント · シェード · トーン
ティント
- BAE49C
- C1E7A8
- C9EAB3
- D1EEBE
- D8F1C9
- E0F4D4
- E8F6DF
- F0F9E9
- F7FCF4
シェード
- 9AC47D
- 83A76A
- 6D8B58
- 577046
- 435635
- 2F3E25
- 1D2715
- 0C1207
- 010201
トーン
- ADD790
- A8CD8F
- A3C38D
- 9EB98C
- 99B08A
- 94A688
- 8F9C87
- 8A9384
- 858982
カラーハーモニー
補色 +180°
- B2E191
Sage Sensation
- E7BDFF
≈ Euphoria
類似色 -30° +30°
- B2E191
Sage Sensation
- DED476
≈ Golden Rice
- 82E8BA
≈ Jittery Jade
トライアド +120° +240°
- B2E191
Sage Sensation
- AFD4FF
≈ Ice Cold Stare
- FFBCC1
≈ A Lot of Love
スプリットコンプリメンタリー +150° +210°
- B2E191
Sage Sensation
- C9CBFF
≈ Lavender Blue
- FFB6E1
≈ Hot Aquarelle Pink
テトラード +90° +180° +270°
- B2E191
Sage Sensation
- 84DFFF
≈ Tranquil Pool
- E7BDFF
≈ Euphoria
- FFBFA6
≈ Sweet Apricot
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.49:1 · APCA Lc 23
Ag
AAA黒の上
WCAG 14.07:1 · APCA Lc 80
最適な文字色: #000000
WCAG 14.07:1 (AAA) · APCA Lc 80
Contrast pairs
コードスニペット
CSS
:root {
--sage-sensation: #b2e191;
--sage-sensation-rgb: 178 225 145;
--sage-sensation-oklch: oklch(0.858 0.117 133.1);
}
.element {
color: var(--sage-sensation);
background-color: hsl(95 57% 73%);
border-color: oklch(0.858 0.117 133.1);
}Tailwind CSS v4
@theme {
--color-sage-sensation: #b2e191;
--color-sage-sensation-50: #e7fddc;
--color-sage-sensation-100: #d7f1ca;
--color-sage-sensation-200: #bfe0ae;
--color-sage-sensation-300: #9ec589;
--color-sage-sensation-400: #83ad64;
--color-sage-sensation-500: #669640;
--color-sage-sensation-600: #577f37;
--color-sage-sensation-700: #45662c;
--color-sage-sensation-800: #344a1c;
--color-sage-sensation-900: #233413;
--color-sage-sensation-950: #121f05;
}SCSS
$sage-sensation: #b2e191;
$sage-sensation-rgb: 178, 225, 145;
$sage-sensation-light: mix(#fff, $sage-sensation, 20%);
$sage-sensation-dark: mix(#000, $sage-sensation, 20%);
.element {
color: $sage-sensation;
box-shadow: 0 0 0 2px rgba($sage-sensation, 0.35);
}