最も近い色名 · #F4FAFB
#F4FAFB
最も近い色名: Heart of Ice
#F4FAFB（rgb(244 250 251)、hsl(189 47% 97%)、oklch(0.981 0.007 208.8)）に最も近い色名はHeart of Iceです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#F4FAFB
oklch(0.981 0.007 208.8)
カラー変換
- HEX
- #f4fafb
- RGB
- rgb(244 250 251)
- HSL
- hsl(189 47% 97%)
- HWB
- hwb(189 96% 2%)
- OKLCH
- oklch(0.981 0.007 208.8)
- OKLab
- oklab(0.981 -0.006 -0.003)
- CIE Lab
- lab(97.84 -1.92 -1.21)
- LCH
- lch(97.84 2.26 212.3)
- CMYK
- cmyk(3% 0% 0% 2%)
ティント · シェード · トーン
ティント
- F5FBFB
- F6FBFC
- F7FCFC
- F8FCFD
- FAFDFD
- FBFDFD
- FCFEFE
- FDFEFE
- FEFFFF
シェード
- D4D9DA
- B5BABA
- 979B9C
- 7A7D7E
- 5E6161
- 444646
- 2B2D2D
- 141515
- 030303
トーン
- E8EDEE
- DCE0E1
- D0D4D5
- C4C7C8
- B8BBBC
- ADAFAF
- A1A3A3
- 969797
- 8B8B8C
カラーハーモニー
補色 +180°
- F4FAFB
Heart of Ice
- FDF7F6
≈ Orange Albedo
類似色 -30° +30°
- F4FAFB
Heart of Ice
- F4FAF9
≈ White Porcelain
- F5F9FD
≈ Mā White
トライアド +120° +240°
- F4FAFB
Heart of Ice
- FBF7FB
≈ Walkie Chalkie
- FAF9F4
≈ Blanca Peak
スプリットコンプリメンタリー +150° +210°
- F4FAFB
Heart of Ice
- FDF7F9
≈ Sea Salt Sherbet
- FCF8F4
≈ Orange Albedo
テトラード +90° +180° +270°
- F4FAFB
Heart of Ice
- F9F8FD
≈ Ghost White
- FDF7F6
≈ Orange Albedo
- F8F9F5
≈ Whitest White
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.05:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 19.91:1 · APCA Lc 104
最適な文字色: #000000
WCAG 19.91:1 (AAA) · APCA Lc 104
Contrast pairs
コードスニペット
CSS
:root {
--heart-of-ice: #f4fafb;
--heart-of-ice-rgb: 244 250 251;
--heart-of-ice-oklch: oklch(0.981 0.007 208.8);
}
.element {
color: var(--heart-of-ice);
background-color: hsl(189 47% 97%);
border-color: oklch(0.981 0.007 208.8);
}Tailwind CSS v4
@theme {
--color-heart-of-ice: #f4fafb;
--color-heart-of-ice-50: #f3f6f6;
--color-heart-of-ice-100: #e5e8e9;
--color-heart-of-ice-200: #d1d5d6;
--color-heart-of-ice-300: #b4b8b9;
--color-heart-of-ice-400: #9a9fa0;
--color-heart-of-ice-500: #818788;
--color-heart-of-ice-600: #6e7373;
--color-heart-of-ice-700: #585c5c;
--color-heart-of-ice-800: #404343;
--color-heart-of-ice-900: #2c2e2f;
--color-heart-of-ice-950: #191b1b;
}SCSS
$heart-of-ice: #f4fafb;
$heart-of-ice-rgb: 244, 250, 251;
$heart-of-ice-light: mix(#fff, $heart-of-ice, 20%);
$heart-of-ice-dark: mix(#000, $heart-of-ice, 20%);
.element {
color: $heart-of-ice;
box-shadow: 0 0 0 2px rgba($heart-of-ice, 0.35);
}