最も近い色名 · #E4F7E6
#E4F7E6
最も近い色名: Frozen Civilization
#E4F7E6（rgb(228 247 230)、hsl(126 54% 93%)、oklch(0.957 0.03 148.4)）に最も近い色名はFrozen Civilizationです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#E4F7E6
oklch(0.957 0.03 148.4)
カラー変換
- HEX
- #e4f7e6
- RGB
- rgb(228 247 230)
- HSL
- hsl(126 54% 93%)
- HWB
- hwb(126 89% 3%)
- OKLCH
- oklch(0.957 0.03 148.4)
- OKLab
- oklab(0.957 -0.026 0.016)
- CIE Lab
- lab(95.47 -8.75 5.96)
- LCH
- lch(95.47 10.59 145.8)
- CMYK
- cmyk(8% 0% 7% 3%)
ティント · シェード · トーン
ティント
- E7F8E8
- E9F9EB
- ECF9ED
- EFFAF0
- F2FBF2
- F4FCF5
- F7FDF7
- FAFDFA
- FCFEFC
シェード
- C6D7C8
- A9B7AB
- 8D998E
- 727C73
- 586059
- 3F4540
- 282C28
- 121513
- 030303
トーン
- DAEADB
- CFDED1
- C5D2C6
- BBC6BC
- B1BAB2
- A7AEA8
- 9DA29D
- 939794
- 8A8B8A
カラーハーモニー
補色 +180°
- E4F7E6
Frozen Civilization
- FDEAFB
≈ Placebo Pink
類似色 -30° +30°
- E4F7E6
Frozen Civilization
- EFF4DE
≈ Overexposed Shot
- DDF8F1
≈ Frosty Mint
トライアド +120° +240°
- E4F7E6
Frozen Civilization
- EBF1FF
≈ Carte Blanche
- FFECE9
≈ Rose Frost
スプリットコンプリメンタリー +150° +210°
- E4F7E6
Frozen Civilization
- F3EEFF
≈ Foundation White
- FFEBF1
≈ Fairy Wings
テトラード +90° +180° +270°
- E4F7E6
Frozen Civilization
- E4F4FF
≈ Kodama White
- FDEAFB
≈ Placebo Pink
- FFEDE0
≈ Organic Fibre
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.12:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 18.74:1 · APCA Lc 99
最適な文字色: #000000
WCAG 18.74:1 (AAA) · APCA Lc 99
Contrast pairs
コードスニペット
CSS
:root {
--frozen-civilization: #e4f7e6;
--frozen-civilization-rgb: 228 247 230;
--frozen-civilization-oklch: oklch(0.957 0.03 148.4);
}
.element {
color: var(--frozen-civilization);
background-color: hsl(126 54% 93%);
border-color: oklch(0.957 0.03 148.4);
}Tailwind CSS v4
@theme {
--color-frozen-civilization: #e4f7e6;
--color-frozen-civilization-50: #eff8f1;
--color-frozen-civilization-100: #e1ebe3;
--color-frozen-civilization-200: #ccd8ce;
--color-frozen-civilization-300: #adbcaf;
--color-frozen-civilization-400: #93a495;
--color-frozen-civilization-500: #798c7b;
--color-frozen-civilization-600: #677668;
--color-frozen-civilization-700: #525f53;
--color-frozen-civilization-800: #3c453c;
--color-frozen-civilization-900: #293029;
--color-frozen-civilization-950: #171c17;
}SCSS
$frozen-civilization: #e4f7e6;
$frozen-civilization-rgb: 228, 247, 230;
$frozen-civilization-light: mix(#fff, $frozen-civilization, 20%);
$frozen-civilization-dark: mix(#000, $frozen-civilization, 20%);
.element {
color: $frozen-civilization;
box-shadow: 0 0 0 2px rgba($frozen-civilization, 0.35);
}