色名 · #F2E6DD
Fantasy
Fantasyは#F2E6DD：rgb(242 230 221)、hsl(26 45% 91%)、oklch(0.932 0.018 59.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Fantasy color name →
#F2E6DD
oklch(0.932 0.018 59.5)
カラー変換
- HEX
- #f2e6dd
- RGB
- rgb(242 230 221)
- HSL
- hsl(26 45% 91%)
- HWB
- hwb(26 87% 5%)
- OKLCH
- oklch(0.932 0.018 59.5)
- OKLab
- oklab(0.932 0.009 0.015)
- CIE Lab
- lab(92.07 3.09 5.93)
- LCH
- lch(92.07 6.69 62.5)
- CMYK
- cmyk(0% 5% 9% 5%)
ティント · シェード · トーン
ティント
- F3E8E0
- F5EBE4
- F6EDE7
- F7F0EB
- F9F2EE
- FAF5F1
- FBF7F5
- FCFAF8
- FEFCFC
シェード
- D2C8C0
- B4ABA4
- 968E88
- 79736E
- 5E5955
- 43403D
- 2B2826
- 141311
- 030302
トーン
- E6DBD3
- DAD1CA
- CEC6C0
- C3BCB7
- B7B2AD
- ACA7A4
- A19D9B
- 969492
- 8B8A89
カラーハーモニー
補色 +180°
- F2E6DD
Fantasy
- DEEAF3
≈ Freeze Up
類似色 -30° +30°
- F2E6DD
Fantasy
- F4E4E2
≈ Rockabye Baby
- EDE8DB
≈ Hint of Vanilla
トライアド +120° +240°
- F2E6DD
Fantasy
- DDEDE9
≈ Tranquil
- EAE6F3
≈ Tranquil Eve
スプリットコンプリメンタリー +150° +210°
- F2E6DD
Fantasy
- DCECEF
≈ Blue Flax
- E4E8F5
≈ Whisper Blue
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.22:1 · APCA Lc 11
Ag
AAA黒の上
WCAG 17.13:1 · APCA Lc 93
最適な文字色: #000000
WCAG 17.13:1 (AAA) · APCA Lc 93
Contrast pairs
コードスニペット
CSS
:root {
--fantasy: #f2e6dd;
--fantasy-rgb: 242 230 221;
--fantasy-oklch: oklch(0.932 0.018 59.5);
}
.element {
color: var(--fantasy);
background-color: hsl(26 45% 91%);
border-color: oklch(0.932 0.018 59.5);
}Tailwind CSS v4
@theme {
--color-fantasy: #f2e6dd;
--color-fantasy-50: #f9f4f0;
--color-fantasy-100: #ece7e2;
--color-fantasy-200: #dad3cd;
--color-fantasy-300: #beb6ae;
--color-fantasy-400: #a79c94;
--color-fantasy-500: #8f847b;
--color-fantasy-600: #796f68;
--color-fantasy-700: #615953;
--color-fantasy-800: #47413c;
--color-fantasy-900: #312d2a;
--color-fantasy-950: #1d1a17;
}SCSS
$fantasy: #f2e6dd;
$fantasy-rgb: 242, 230, 221;
$fantasy-light: mix(#fff, $fantasy, 20%);
$fantasy-dark: mix(#000, $fantasy, 20%);
.element {
color: $fantasy;
box-shadow: 0 0 0 2px rgba($fantasy, 0.35);
}