色名 · #9EC6C6
Raindrop
Raindropは#9EC6C6：rgb(158 198 198)、hsl(180 26% 70%)、oklch(0.798 0.042 196.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Raindrop color name →
#9EC6C6
oklch(0.798 0.042 196.3)
カラー変換
- HEX
- #9ec6c6
- RGB
- rgb(158 198 198)
- HSL
- hsl(180 26% 70%)
- HWB
- hwb(180 62% 22%)
- OKLCH
- oklch(0.798 0.042 196.3)
- OKLab
- oklab(0.798 -0.041 -0.012)
- CIE Lab
- lab(76.99 -13.74 -4.62)
- LCH
- lch(76.99 14.5 198.6)
- CMYK
- cmyk(20% 0% 0% 22%)
ティント · シェード · トーン
ティント
- A8CCCC
- B1D1D1
- BBD7D7
- C5DDDC
- CEE2E2
- D8E8E8
- E2EEEE
- EBF3F3
- F5F9F9
シェード
- 89ACAC
- 749292
- 607A7A
- 4D6262
- 3A4B4B
- 293535
- 182121
- 090E0E
- 010202
トーン
- 9BBFBF
- 98B8B8
- 95B1B0
- 93A9A9
- 90A2A2
- 8D9B9B
- 899494
- 868E8E
- 838787
カラーハーモニー
補色 +180°
- 9EC6C6
Raindrop
- D7B3B4
≈ Pink Flare
類似色 -30° +30°
- 9EC6C6
Raindrop
- A4C6B7
≈ Kind Green
- A1C3D2
≈ Airborne
トライアド +120° +240°
- 9EC6C6
Raindrop
- C8B5D0
≈ Sweet Scent
- CDBA9F
≈ Gobi Desert
スプリットコンプリメンタリー +150° +210°
- 9EC6C6
Raindrop
- D2B3C3
≈ Tranquil Dusk
- D5B5A6
≈ Likeable Sand
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.85:1 · APCA Lc 35
Ag
AAA黒の上
WCAG 11.34:1 · APCA Lc 68
最適な文字色: #000000
WCAG 11.34:1 (AAA) · APCA Lc 68
Contrast pairs
コードスニペット
CSS
:root {
--raindrop: #9ec6c6;
--raindrop-rgb: 158 198 198;
--raindrop-oklch: oklch(0.798 0.042 196.3);
}
.element {
color: var(--raindrop);
background-color: hsl(180 26% 70%);
border-color: oklch(0.798 0.042 196.3);
}Tailwind CSS v4
@theme {
--color-raindrop: #9ec6c6;
--color-raindrop-50: #e8f9f9;
--color-raindrop-100: #d8eded;
--color-raindrop-200: #c0dadb;
--color-raindrop-300: #9fbebf;
--color-raindrop-400: #82a7a7;
--color-raindrop-500: #658f8f;
--color-raindrop-600: #567979;
--color-raindrop-700: #446161;
--color-raindrop-800: #314747;
--color-raindrop-900: #213131;
--color-raindrop-950: #101d1d;
}SCSS
$raindrop: #9ec6c6;
$raindrop-rgb: 158, 198, 198;
$raindrop-light: mix(#fff, $raindrop, 20%);
$raindrop-dark: mix(#000, $raindrop, 20%);
.element {
color: $raindrop;
box-shadow: 0 0 0 2px rgba($raindrop, 0.35);
}