色名 · #7ECBE2
Big Chill
Big Chillは#7ECBE2：rgb(126 203 226)、hsl(194 63% 69%)、oklch(0.8 0.083 218.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Big Chill color name →
#7ECBE2
oklch(0.8 0.083 218.9)
カラー変換
- HEX
- #7ecbe2
- RGB
- rgb(126 203 226)
- HSL
- hsl(194 63% 69%)
- HWB
- hwb(194 49% 11%)
- OKLCH
- oklch(0.8 0.083 218.9)
- OKLab
- oklab(0.8 -0.064 -0.052)
- CIE Lab
- lab(77.32 -20.3 -19.35)
- LCH
- lch(77.32 28.05 223.6)
- CMYK
- cmyk(44% 10% 0% 11%)
ティント · シェード · トーン
ティント
- 8CD0E5
- 9AD6E8
- A7DBEB
- B4E0EE
- C1E5F1
- CDEAF4
- DAF0F7
- E6F5F9
- F3FAFC
シェード
- 6DB0C4
- 5C96A8
- 4C7D8C
- 3C6571
- 2D4D57
- 1F373E
- 112227
- 050F12
- 010203
トーン
- 7FC3D8
- 81BCCE
- 81B4C4
- 82ADBA
- 82A5B0
- 829EA6
- 82969D
- 828F93
- 818789
カラーハーモニー
補色 +180°
- 7ECBE2
Big Chill
- EDAC97
≈ Shishi Pink
類似色 -30° +30°
- 7ECBE2
Big Chill
- 7BCFC8
≈ Blue Green Gem
- 94C3F1
≈ Sail to the Sea
トライアド +120° +240°
- 7ECBE2
Big Chill
- E2AAD0
≈ Pink Bliss
- CBBF81
≈ Wheat Grass
スプリットコンプリメンタリー +150° +210°
- 7ECBE2
Big Chill
- EDA8B3
≈ Princess
- E1B583
≈ Cellini Gold
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.82:1 · APCA Lc 34
Ag
AAA黒の上
WCAG 11.52:1 · APCA Lc 69
最適な文字色: #000000
WCAG 11.52:1 (AAA) · APCA Lc 69
Contrast pairs
コードスニペット
CSS
:root {
--big-chill: #7ecbe2;
--big-chill-rgb: 126 203 226;
--big-chill-oklch: oklch(0.8 0.083 218.9);
}
.element {
color: var(--big-chill);
background-color: hsl(194 63% 69%);
border-color: oklch(0.8 0.083 218.9);
}Tailwind CSS v4
@theme {
--color-big-chill: #7ecbe2;
--color-big-chill-50: #dcfbff;
--color-big-chill-100: #cbeffc;
--color-big-chill-200: #aedded;
--color-big-chill-300: #87c2d5;
--color-big-chill-400: #62aac0;
--color-big-chill-500: #3a93ab;
--color-big-chill-600: #337c91;
--color-big-chill-700: #286474;
--color-big-chill-800: #1b4955;
--color-big-chill-900: #11333b;
--color-big-chill-950: #031e25;
}SCSS
$big-chill: #7ecbe2;
$big-chill-rgb: 126, 203, 226;
$big-chill-light: mix(#fff, $big-chill, 20%);
$big-chill-dark: mix(#000, $big-chill, 20%);
.element {
color: $big-chill;
box-shadow: 0 0 0 2px rgba($big-chill, 0.35);
}