色名 · #97CBD2
Gentle Aquamarine
Gentle Aquamarineは#97CBD2：rgb(151 203 210)、hsl(187 40% 71%)、oklch(0.808 0.055 206.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Gentle Aquamarine color name →
#97CBD2
oklch(0.808 0.055 206.5)
カラー変換
- HEX
- #97cbd2
- RGB
- rgb(151 203 210)
- HSL
- hsl(187 40% 71%)
- HWB
- hwb(187 59% 18%)
- OKLCH
- oklch(0.808 0.055 206.5)
- OKLab
- oklab(0.808 -0.049 -0.024)
- CIE Lab
- lab(78.23 -16.29 -9.28)
- LCH
- lch(78.23 18.75 209.7)
- CMYK
- cmyk(28% 3% 0% 18%)
ティント · シェード · トーン
ティント
- A2D0D6
- ACD5DB
- B7DBDF
- C1E0E4
- CBE5E8
- D6EAED
- E0EFF1
- EAF5F6
- F5FAFA
シェード
- 83B0B6
- 6F969B
- 5C7D81
- 496568
- 374D50
- 263739
- 172224
- 080F10
- 010202
トーン
- 95C3CA
- 93BCC1
- 91B4B9
- 8FACB0
- 8DA5A8
- 8A9DA0
- 889698
- 858F90
- 838788
カラーハーモニー
補色 +180°
- 97CBD2
Gentle Aquamarine
- E2B3AE
≈ Stormy Pink
類似色 -30° +30°
- 97CBD2
Gentle Aquamarine
- 9BCCBF
≈ Thermal Aqua
- 9FC6E0
≈ Legacy Blue
トライアド +120° +240°
- 97CBD2
Gentle Aquamarine
- D4B5D3
≈ Lilac Haze
- D0BF98
≈ Sandy Pail
スプリットコンプリメンタリー +150° +210°
- 97CBD2
Gentle Aquamarine
- DFB2C1
≈ Mental Floss
- DDB89F
≈ Wassail
テトラード +90° +180° +270°
- 97CBD2
Gentle Aquamarine
- C3BAE0
≈ Melrose
- E2B3AE
≈ Stormy Pink
- BEC59D
≈ Seagrass
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.78:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.78:1 · APCA Lc 70
最適な文字色: #000000
WCAG 11.78:1 (AAA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--gentle-aquamarine: #97cbd2;
--gentle-aquamarine-rgb: 151 203 210;
--gentle-aquamarine-oklch: oklch(0.808 0.055 206.5);
}
.element {
color: var(--gentle-aquamarine);
background-color: hsl(187 40% 71%);
border-color: oklch(0.808 0.055 206.5);
}Tailwind CSS v4
@theme {
--color-gentle-aquamarine: #97cbd2;
--color-gentle-aquamarine-50: #e4fafd;
--color-gentle-aquamarine-100: #d4edf2;
--color-gentle-aquamarine-200: #badbe1;
--color-gentle-aquamarine-300: #97c0c6;
--color-gentle-aquamarine-400: #78a8af;
--color-gentle-aquamarine-500: #589198;
--color-gentle-aquamarine-600: #4c7b81;
--color-gentle-aquamarine-700: #3c6267;
--color-gentle-aquamarine-800: #2b484b;
--color-gentle-aquamarine-900: #1d3234;
--color-gentle-aquamarine-950: #0d1e20;
}SCSS
$gentle-aquamarine: #97cbd2;
$gentle-aquamarine-rgb: 151, 203, 210;
$gentle-aquamarine-light: mix(#fff, $gentle-aquamarine, 20%);
$gentle-aquamarine-dark: mix(#000, $gentle-aquamarine, 20%);
.element {
color: $gentle-aquamarine;
box-shadow: 0 0 0 2px rgba($gentle-aquamarine, 0.35);
}