色名 · #8ACFD6
Sky Watch
Sky Watchは#8ACFD6：rgb(138 207 214)、hsl(186 48% 69%)、oklch(0.811 0.07 204)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Sky Watch color name →
#8ACFD6
oklch(0.811 0.07 204)
カラー変換
- HEX
- #8acfd6
- RGB
- rgb(138 207 214)
- HSL
- hsl(186 48% 69%)
- HWB
- hwb(186 54% 16%)
- OKLCH
- oklch(0.811 0.07 204)
- OKLab
- oklab(0.811 -0.064 -0.028)
- CIE Lab
- lab(78.73 -21.25 -10.78)
- LCH
- lch(78.73 23.83 206.9)
- CMYK
- cmyk(36% 3% 0% 16%)
ティント · シェード · トーン
ティント
- 97D4DA
- A3D9DE
- AFDEE2
- BAE2E6
- C6E7EA
- D2ECEF
- DDF1F3
- E8F5F7
- F4FAFB
シェード
- 77B4BA
- 65999E
- 537F84
- 42676A
- 324F52
- 22383B
- 142325
- 071010
- 010202
トーン
- 8AC7CD
- 8ABFC4
- 89B7BB
- 88AFB3
- 87A7AA
- 869FA2
- 859799
- 838F91
- 828888
カラーハーモニー
補色 +180°
- 8ACFD6
Sky Watch
- EBB0AB
≈ Sweet Tart
類似色 -30° +30°
- 8ACFD6
Sky Watch
- 91D1BE
≈ Wintermint
- 94C9E8
≈ Light Cornflower Blue
トライアド +120° +240°
- 8ACFD6
Sky Watch
- D8B2DB
≈ Blushing Sky
- D7BE8E
≈ Honey Tea
スプリットコンプリメンタリー +150° +210°
- 8ACFD6
Sky Watch
- E7AFC4
≈ Pink Macaroon
- E6B697
≈ Creole Cottage
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.75:1 · APCA Lc 32
Ag
AAA黒の上
WCAG 11.97:1 · APCA Lc 71
最適な文字色: #000000
WCAG 11.97:1 (AAA) · APCA Lc 71
Contrast pairs
コードスニペット
CSS
:root {
--sky-watch: #8acfd6;
--sky-watch-rgb: 138 207 214;
--sky-watch-oklch: oklch(0.811 0.07 204);
}
.element {
color: var(--sky-watch);
background-color: hsl(186 48% 69%);
border-color: oklch(0.811 0.07 204);
}Tailwind CSS v4
@theme {
--color-sky-watch: #8acfd6;
--color-sky-watch-50: #dffbff;
--color-sky-watch-100: #ceeff3;
--color-sky-watch-200: #b2dde3;
--color-sky-watch-300: #8dc2c9;
--color-sky-watch-400: #6babb1;
--color-sky-watch-500: #46949b;
--color-sky-watch-600: #3d7d83;
--color-sky-watch-700: #306469;
--color-sky-watch-800: #214a4d;
--color-sky-watch-900: #163335;
--color-sky-watch-950: #071f20;
}SCSS
$sky-watch: #8acfd6;
$sky-watch-rgb: 138, 207, 214;
$sky-watch-light: mix(#fff, $sky-watch, 20%);
$sky-watch-dark: mix(#000, $sky-watch, 20%);
.element {
color: $sky-watch;
box-shadow: 0 0 0 2px rgba($sky-watch, 0.35);
}