色名 · #F7E4CC
Cannellini Beans
Cannellini Beansは#F7E4CC：rgb(247 228 204)、hsl(33 73% 88%)、oklch(0.928 0.038 73.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Cannellini Beans color name →
#F7E4CC
oklch(0.928 0.038 73.7)
カラー変換
- HEX
- #f7e4cc
- RGB
- rgb(247 228 204)
- HSL
- hsl(33 73% 88%)
- HWB
- hwb(33 80% 3%)
- OKLCH
- oklch(0.928 0.038 73.7)
- OKLab
- oklab(0.928 0.011 0.036)
- CIE Lab
- lab(91.67 3.9 14.23)
- LCH
- lch(91.67 14.75 74.7)
- CMYK
- cmyk(0% 8% 17% 3%)
ティント · シェード · トーン
ティント
- F8E7D1
- F9E9D6
- F9ECDB
- FAEFE0
- FBF2E6
- FCF4EB
- FDF7F0
- FDFAF5
- FEFCFA
シェード
- D7C6B1
- B7A997
- 998D7E
- 7C7265
- 60584E
- 453F37
- 2C2822
- 15120F
- 030302
トーン
- EBDAC4
- DECFBC
- D2C5B5
- C6BBAD
- BAB1A5
- AEA79E
- A29D96
- 97938F
- 8B8A87
カラーハーモニー
補色 +180°
- F7E4CC
Cannellini Beans
- D7E9FF
≈ Veiling Waterfalls
類似色 -30° +30°
- F7E4CC
Cannellini Beans
- FEE0D3
≈ Light Quilt
- EBE9CC
≈ Palmito
トライアド +120° +240°
- F7E4CC
Cannellini Beans
- CBF0EE
≈ Princess Blue Feather
- F1E0FA
≈ Lavender Savour
スプリットコンプリメンタリー +150° +210°
- F7E4CC
Cannellini Beans
- CDEDFA
≈ Blue Hijab
- E3E5FF
≈ Lavender Mist
テトラード +90° +180° +270°
- F7E4CC
Cannellini Beans
- D1F0E0
≈ Pastel Jade
- D7E9FF
≈ Veiling Waterfalls
- FBDEEE
≈ Transparent Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.24:1 · APCA Lc 12
Ag
AAA黒の上
WCAG 16.92:1 · APCA Lc 92
最適な文字色: #000000
WCAG 16.92:1 (AAA) · APCA Lc 92
Contrast pairs
コードスニペット
CSS
:root {
--cannellini-beans: #f7e4cc;
--cannellini-beans-rgb: 247 228 204;
--cannellini-beans-oklch: oklch(0.928 0.038 73.7);
}
.element {
color: var(--cannellini-beans);
background-color: hsl(33 73% 88%);
border-color: oklch(0.928 0.038 73.7);
}Tailwind CSS v4
@theme {
--color-cannellini-beans: #f7e4cc;
--color-cannellini-beans-50: #fcf4e9;
--color-cannellini-beans-100: #efe6da;
--color-cannellini-beans-200: #ded2c3;
--color-cannellini-beans-300: #c3b5a2;
--color-cannellini-beans-400: #ac9c86;
--color-cannellini-beans-500: #96836b;
--color-cannellini-beans-600: #7f6f5a;
--color-cannellini-beans-700: #655948;
--color-cannellini-beans-800: #4b4034;
--color-cannellini-beans-900: #342c23;
--color-cannellini-beans-950: #1f1912;
}SCSS
$cannellini-beans: #f7e4cc;
$cannellini-beans-rgb: 247, 228, 204;
$cannellini-beans-light: mix(#fff, $cannellini-beans, 20%);
$cannellini-beans-dark: mix(#000, $cannellini-beans, 20%);
.element {
color: $cannellini-beans;
box-shadow: 0 0 0 2px rgba($cannellini-beans, 0.35);
}