色名 · #84A7CE
Windfall
Windfallは#84A7CE：rgb(132 167 206)、hsl(212 43% 66%)、oklch(0.717 0.069 251.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Blue mean? → · Windfall color name →
#84A7CE
oklch(0.717 0.069 251.5)
カラー変換
- HEX
- #84a7ce
- RGB
- rgb(132 167 206)
- HSL
- hsl(212 43% 66%)
- HWB
- hwb(212 52% 19%)
- OKLCH
- oklch(0.717 0.069 251.5)
- OKLab
- oklab(0.717 -0.022 -0.065)
- CIE Lab
- lab(66.96 -5.13 -24.1)
- LCH
- lch(66.96 24.64 258)
- CMYK
- cmyk(36% 19% 0% 19%)
ティント · シェード · トーン
ティント
- 90B0D3
- 9CB8D8
- A8C1DD
- B4CAE2
- C1D3E7
- CDDBEC
- D9E4F1
- E6EDF6
- F2F6FA
シェード
- 7291B3
- 607B98
- 4F667F
- 3F5266
- 2F3E4E
- 202C38
- 121A23
- 060A0F
- 010102
トーン
- 84A3C6
- 849FBE
- 839BB6
- 8397AE
- 8394A7
- 82909F
- 828C97
- 81888F
- 818488
カラーハーモニー
補色 +180°
- 84A7CE
Windfall
- BF9D74
≈ Almond Toast
類似色 -30° +30°
- 84A7CE
Windfall
- 72AEC2
≈ Blue Eye Samurai
- 9C9FCE
≈ Indigo Child
トライアド +120° +240°
- 84A7CE
Windfall
- CB9298
≈ Ducal Pink
- 94AD80
≈ Forest Shade
スプリットコンプリメンタリー +150° +210°
- 84A7CE
Windfall
- CA9682
≈ Beauty and the Beach
- ACA573
≈ Crack Willow
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.50:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.39:1 · APCA Lc 53
最適な文字色: #000000
WCAG 8.39:1 (AAA) · APCA Lc 53
Contrast pairs
コードスニペット
CSS
:root {
--windfall: #84a7ce;
--windfall-rgb: 132 167 206;
--windfall-oklch: oklch(0.717 0.069 251.5);
}
.element {
color: var(--windfall);
background-color: hsl(212 43% 66%);
border-color: oklch(0.717 0.069 251.5);
}Tailwind CSS v4
@theme {
--color-windfall: #84a7ce;
--color-windfall-50: #e8f7ff;
--color-windfall-100: #d8eaff;
--color-windfall-200: #c0d7f2;
--color-windfall-300: #9fbadb;
--color-windfall-400: #81a2c7;
--color-windfall-500: #6489b3;
--color-windfall-600: #557497;
--color-windfall-700: #445d79;
--color-windfall-800: #304459;
--color-windfall-900: #202f3f;
--color-windfall-950: #101c28;
}SCSS
$windfall: #84a7ce;
$windfall-rgb: 132, 167, 206;
$windfall-light: mix(#fff, $windfall, 20%);
$windfall-dark: mix(#000, $windfall, 20%);
.element {
color: $windfall;
box-shadow: 0 0 0 2px rgba($windfall, 0.35);
}