色名 · #9BADA8
April Rain
April Rainは#9BADA8：rgb(155 173 168)、hsl(163 10% 64%)、oklch(0.732 0.021 177.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · April Rain color name →
#9BADA8
oklch(0.732 0.021 177.2)
カラー変換
- HEX
- #9bada8
- RGB
- rgb(155 173 168)
- HSL
- hsl(163 10% 64%)
- HWB
- hwb(163 61% 32%)
- OKLCH
- oklch(0.732 0.021 177.2)
- OKLab
- oklab(0.732 -0.021 0.001)
- CIE Lab
- lab(69.2 -7.25 0.33)
- LCH
- lch(69.2 7.26 177.4)
- CMYK
- cmyk(10% 0% 3% 32%)
ティント · シェード · トーン
ティント
- A5B5B0
- AEBDB9
- B8C5C1
- C2CDCA
- CCD5D3
- D6DEDB
- E0E6E4
- EAEEED
- F5F7F6
シェード
- 869692
- 727F7C
- 5E6A67
- 4B5552
- 39413F
- 282D2C
- 181B1A
- 090B0A
- 010101
トーン
- 98A8A4
- 96A4A0
- 939F9C
- 909B98
- 8E9694
- 8B9290
- 888D8C
- 858988
- 838484
カラーハーモニー
補色 +180°
- 9BADA8
April Rain
- B4A3A8
≈ Magical Mauve
類似色 -30° +30°
- 9BADA8
April Rain
- A0ACA1
≈ Green Balsam
- 9AACAF
≈ Bucolic Blue
トライアド +120° +240°
- 9BADA8
April Rain
- A9A6B4
≈ Curated Lilac
- B3A59C
≈ Deer Run
スプリットコンプリメンタリー +150° +210°
- 9BADA8
April Rain
- B0A4AF
≈ Midsummer Twilight
- B6A4A1
≈ Lilac Smoke
テトラード +90° +180° +270°
- 9BADA8
April Rain
- A2A8B6
≈ Ridge View
- B4A3A8
≈ Magical Mauve
- AEA89A
≈ Grey Silt
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.34:1 · APCA Lc 46
Ag
AAA黒の上
WCAG 8.93:1 · APCA Lc 56
最適な文字色: #000000
WCAG 8.93:1 (AAA) · APCA Lc 56
Contrast pairs
コードスニペット
CSS
:root {
--april-rain: #9bada8;
--april-rain-rgb: 155 173 168;
--april-rain-oklch: oklch(0.732 0.021 177.2);
}
.element {
color: var(--april-rain);
background-color: hsl(163 10% 64%);
border-color: oklch(0.732 0.021 177.2);
}Tailwind CSS v4
@theme {
--color-april-rain: #9bada8;
--color-april-rain-50: #eff7f5;
--color-april-rain-100: #e1eae8;
--color-april-rain-200: #cbd7d4;
--color-april-rain-300: #acbbb7;
--color-april-rain-400: #92a39e;
--color-april-rain-500: #788b86;
--color-april-rain-600: #667671;
--color-april-rain-700: #515e5b;
--color-april-rain-800: #3b4542;
--color-april-rain-900: #28302d;
--color-april-rain-950: #161c1a;
}SCSS
$april-rain: #9bada8;
$april-rain-rgb: 155, 173, 168;
$april-rain-light: mix(#fff, $april-rain, 20%);
$april-rain-dark: mix(#000, $april-rain, 20%);
.element {
color: $april-rain;
box-shadow: 0 0 0 2px rgba($april-rain, 0.35);
}