色名 · #F9DFE5
Cake Frosting
Cake Frostingは#F9DFE5：rgb(249 223 229)、hsl(346 68% 93%)、oklch(0.927 0.03 2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Cake Frosting color name →
#F9DFE5
oklch(0.927 0.03 2)
カラー変換
- HEX
- #f9dfe5
- RGB
- rgb(249 223 229)
- HSL
- hsl(346 68% 93%)
- HWB
- hwb(346 87% 2%)
- OKLCH
- oklch(0.927 0.03 2)
- OKLab
- oklab(0.927 0.03 0.001)
- CIE Lab
- lab(91.11 9.97 0.5)
- LCH
- lch(91.11 9.98 2.9)
- CMYK
- cmyk(0% 10% 8% 2%)
ティント · シェード · トーン
ティント
- FAE2E8
- FAE5EA
- FBE9ED
- FCECEF
- FCEFF2
- FDF2F5
- FDF5F7
- FEF9FA
- FEFCFC
シェード
- D9C2C7
- B9A5AA
- 9A8A8E
- 7D6F72
- 615658
- 463D3F
- 2C2728
- 151212
- 030203
トーン
- ECD5DA
- E0CBD0
- D3C2C6
- C7B8BB
- BBAEB1
- AFA5A7
- A39C9D
- 979293
- 8B898A
カラーハーモニー
補色 +180°
- F9DFE5
Cake Frosting
- D2EEE8
≈ Teal Ice
類似色 -30° +30°
- F9DFE5
Cake Frosting
- F3E0F0
≈ Sheer Lavender
- FAE0DB
≈ Pink Shimmer
トライアド +120° +240°
- F9DFE5
Cake Frosting
- E3EAD5
≈ Enlightened Lime
- D6EAF9
≈ Cloudless
スプリットコンプリメンタリー +150° +210°
- F9DFE5
Cake Frosting
- D9EDDD
≈ Cottage Green
- D1ECF2
≈ Chalky Blue White
テトラード +90° +180° +270°
- F9DFE5
Cake Frosting
- EEE7D1
≈ Instant Relief
- D2EEE8
≈ Teal Ice
- DFE6FB
≈ Lavender Mist
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.25:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.71:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.71:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--cake-frosting: #f9dfe5;
--cake-frosting-rgb: 249 223 229;
--cake-frosting-oklch: oklch(0.927 0.03 2);
}
.element {
color: var(--cake-frosting);
background-color: hsl(346 68% 93%);
border-color: oklch(0.927 0.03 2);
}Tailwind CSS v4
@theme {
--color-cake-frosting: #f9dfe5;
--color-cake-frosting-50: #fdf2f4;
--color-cake-frosting-100: #f1e4e7;
--color-cake-frosting-200: #e0cfd3;
--color-cake-frosting-300: #c6b1b5;
--color-cake-frosting-400: #ae989d;
--color-cake-frosting-500: #987e84;
--color-cake-frosting-600: #806b70;
--color-cake-frosting-700: #67555a;
--color-cake-frosting-800: #4c3e42;
--color-cake-frosting-900: #342b2d;
--color-cake-frosting-950: #20181a;
}SCSS
$cake-frosting: #f9dfe5;
$cake-frosting-rgb: 249, 223, 229;
$cake-frosting-light: mix(#fff, $cake-frosting, 20%);
$cake-frosting-dark: mix(#000, $cake-frosting, 20%);
.element {
color: $cake-frosting;
box-shadow: 0 0 0 2px rgba($cake-frosting, 0.35);
}