色名 · #9AAFAF
Stormy Bay
Stormy Bayは#9AAFAF：rgb(154 175 175)、hsl(180 12% 65%)、oklch(0.738 0.023 196.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Stormy Bay color name →
#9AAFAF
oklch(0.738 0.023 196.7)
カラー変換
- HEX
- #9aafaf
- RGB
- rgb(154 175 175)
- HSL
- hsl(180 12% 65%)
- HWB
- hwb(180 60% 31%)
- OKLCH
- oklch(0.738 0.023 196.7)
- OKLab
- oklab(0.738 -0.022 -0.007)
- CIE Lab
- lab(69.84 -7.53 -2.6)
- LCH
- lch(69.84 7.97 199)
- CMYK
- cmyk(12% 0% 0% 31%)
ティント · シェード · トーン
ティント
- A4B7B7
- AEBFBF
- B8C6C6
- C2CECE
- CCD6D6
- D6DEDE
- E0E6E6
- EAEFEF
- F5F7F7
シェード
- 859898
- 718181
- 5E6B6B
- 4B5656
- 394141
- 272E2E
- 171C1C
- 090B0B
- 010101
トーン
- 97AAAA
- 95A5A5
- 92A1A1
- 909C9C
- 8D9797
- 8A9392
- 888E8E
- 858989
- 838585
カラーハーモニー
補色 +180°
- 9AAFAF
Stormy Bay
- B9A5A5
≈ Tourmaline Mauve
類似色 -30° +30°
- 9AAFAF
Stormy Bay
- 9DAFA7
≈ Grey Morning
- 9CAEB6
≈ Shower
トライアド +120° +240°
- 9AAFAF
Stormy Bay
- B0A6B4
≈ Plum Frost
- B3A99A
≈ Nantucket Sands
スプリットコンプリメンタリー +150° +210°
- 9AAFAF
Stormy Bay
- B6A5AD
≈ Foggy Plum
- B7A69E
≈ Prestige
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.30:1 · APCA Lc 45
Ag
AAA黒の上
WCAG 9.12:1 · APCA Lc 57
最適な文字色: #000000
WCAG 9.12:1 (AAA) · APCA Lc 57
Contrast pairs
コードスニペット
CSS
:root {
--stormy-bay: #9aafaf;
--stormy-bay-rgb: 154 175 175;
--stormy-bay-oklch: oklch(0.738 0.023 196.7);
}
.element {
color: var(--stormy-bay);
background-color: hsl(180 12% 65%);
border-color: oklch(0.738 0.023 196.7);
}Tailwind CSS v4
@theme {
--color-stormy-bay: #9aafaf;
--color-stormy-bay-50: #eef7f7;
--color-stormy-bay-100: #dfeaeb;
--color-stormy-bay-200: #c9d7d8;
--color-stormy-bay-300: #aabbbc;
--color-stormy-bay-400: #8fa3a3;
--color-stormy-bay-500: #758b8b;
--color-stormy-bay-600: #637676;
--color-stormy-bay-700: #4f5e5e;
--color-stormy-bay-800: #394545;
--color-stormy-bay-900: #273030;
--color-stormy-bay-950: #151c1c;
}SCSS
$stormy-bay: #9aafaf;
$stormy-bay-rgb: 154, 175, 175;
$stormy-bay-light: mix(#fff, $stormy-bay, 20%);
$stormy-bay-dark: mix(#000, $stormy-bay, 20%);
.element {
color: $stormy-bay;
box-shadow: 0 0 0 2px rgba($stormy-bay, 0.35);
}