色名 · #9AC0B6
Shadow Green
Shadow Greenは#9AC0B6：rgb(154 192 182)、hsl(164 23% 68%)、oklch(0.777 0.043 177.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Shadow Green color name →
#9AC0B6
oklch(0.777 0.043 177.3)
カラー変換
- HEX
- #9ac0b6
- RGB
- rgb(154 192 182)
- HSL
- hsl(164 23% 68%)
- HWB
- hwb(164 60% 25%)
- OKLCH
- oklch(0.777 0.043 177.3)
- OKLab
- oklab(0.777 -0.043 0.002)
- CIE Lab
- lab(74.71 -14.74 0.64)
- LCH
- lch(74.71 14.75 177.5)
- CMYK
- cmyk(20% 0% 5% 25%)
ティント · シェード · トーン
ティント
- A4C6BD
- AECCC4
- B8D3CB
- C2D9D3
- CCDFDA
- D6E6E1
- E0ECE9
- EBF2F0
- F5F9F7
シェード
- 85A79E
- 718E86
- 5E766F
- 4B5F59
- 394944
- 273430
- 17201D
- 090E0C
- 010202
トーン
- 98B9B0
- 95B3AB
- 93ACA5
- 90A6A0
- 8EA09B
- 8B9995
- 889390
- 868C8B
- 838685
カラーハーモニー
補色 +180°
- 9AC0B6
Shadow Green
- CFACB7
≈ Sugarplum Dance
類似色 -30° +30°
- 9AC0B6
Shadow Green
- A5BEA7
≈ Bryophyte
- 97BFC5
≈ Rest Assured
トライアド +120° +240°
- 9AC0B6
Shadow Green
- B9B1CF
≈ Petunia Trail
- CDB09C
≈ Frappé
スプリットコンプリメンタリー +150° +210°
- 9AC0B6
Shadow Green
- C6ADC5
≈ Heather Feather
- D1ADA8
≈ Lime Hawk Moth
テトラード +90° +180° +270°
- 9AC0B6
Shadow Green
- AAB6D3
≈ Over the Moon
- CFACB7
≈ Sugarplum Dance
- C2B598
≈ Palisade
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.98:1 · APCA Lc 38
Ag
AAA黒の上
WCAG 10.58:1 · APCA Lc 64
最適な文字色: #000000
WCAG 10.58:1 (AAA) · APCA Lc 64
Contrast pairs
コードスニペット
CSS
:root {
--shadow-green: #9ac0b6;
--shadow-green-rgb: 154 192 182;
--shadow-green-oklch: oklch(0.777 0.043 177.3);
}
.element {
color: var(--shadow-green);
background-color: hsl(164 23% 68%);
border-color: oklch(0.777 0.043 177.3);
}Tailwind CSS v4
@theme {
--color-shadow-green: #9ac0b6;
--color-shadow-green-50: #e9f9f5;
--color-shadow-green-100: #d9ede8;
--color-shadow-green-200: #c2dbd5;
--color-shadow-green-300: #a1bfb8;
--color-shadow-green-400: #84a79e;
--color-shadow-green-500: #679086;
--color-shadow-green-600: #587a71;
--color-shadow-green-700: #46615a;
--color-shadow-green-800: #334742;
--color-shadow-green-900: #22312d;
--color-shadow-green-950: #111d1a;
}SCSS
$shadow-green: #9ac0b6;
$shadow-green-rgb: 154, 192, 182;
$shadow-green-light: mix(#fff, $shadow-green, 20%);
$shadow-green-dark: mix(#000, $shadow-green, 20%);
.element {
color: $shadow-green;
box-shadow: 0 0 0 2px rgba($shadow-green, 0.35);
}