色名 · #FAF7D6
Citrine White
Citrine Whiteは#FAF7D6：rgb(250 247 214)、hsl(55 78% 91%)、oklch(0.97 0.043 102.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Citrine White color name →
#FAF7D6
oklch(0.97 0.043 102.9)
カラー変換
- HEX
- #faf7d6
- RGB
- rgb(250 247 214)
- HSL
- hsl(55 78% 91%)
- HWB
- hwb(55 84% 2%)
- OKLCH
- oklch(0.97 0.043 102.9)
- OKLab
- oklab(0.97 -0.01 0.042)
- CIE Lab
- lab(96.83 -2.95 16.32)
- LCH
- lch(96.83 16.58 100.3)
- CMYK
- cmyk(0% 1% 14% 2%)
ティント · シェード · トーン
ティント
- FAF8DA
- FBF9DE
- FBF9E2
- FCFAE7
- FCFBEB
- FDFCEF
- FDFDF3
- FEFDF7
- FEFEFB
シェード
- D9D7BA
- BAB79E
- 9B9984
- 7D7C6A
- 616052
- 46453B
- 2D2C25
- 151510
- 030302
トーン
- EDEBCD
- E0DEC4
- D4D2BC
- C7C6B3
- BBBAAA
- AFAEA2
- A3A299
- 979791
- 8B8B88
カラーハーモニー
補色 +180°
- FAF7D6
Citrine White
- F3F4FF
≈ Sugar Crystal
類似色 -30° +30°
- FAF7D6
Citrine White
- FFF3E5
≈ Doeskin
- EAFCDE
≈ Pastoral
トライアド +120° +240°
- FAF7D6
Citrine White
- E8F8FF
≈ Clear Skies
- FFF0F8
≈ Pinkish White
スプリットコンプリメンタリー +150° +210°
- FAF7D6
Citrine White
- EEF6FF
≈ Alice Blue
- FAF1FF
≈ Cloud Break
テトラード +90° +180° +270°
- FAF7D6
Citrine White
- D5FFFD
≈ Mount Olympus
- F3F4FF
≈ Sugar Crystal
- FFF1F2
≈ Sefid White
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.08:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 19.34:1 · APCA Lc 102
最適な文字色: #000000
WCAG 19.34:1 (AAA) · APCA Lc 102
Contrast pairs
コードスニペット
CSS
:root {
--citrine-white: #faf7d6;
--citrine-white-rgb: 250 247 214;
--citrine-white-oklch: oklch(0.97 0.043 102.9);
}
.element {
color: var(--citrine-white);
background-color: hsl(55 78% 91%);
border-color: oklch(0.97 0.043 102.9);
}Tailwind CSS v4
@theme {
--color-citrine-white: #faf7d6;
--color-citrine-white-50: #f7f6e8;
--color-citrine-white-100: #eae9d9;
--color-citrine-white-200: #d7d6c1;
--color-citrine-white-300: #bab9a0;
--color-citrine-white-400: #a3a083;
--color-citrine-white-500: #8b8867;
--color-citrine-white-600: #767357;
--color-citrine-white-700: #5e5c45;
--color-citrine-white-800: #454332;
--color-citrine-white-900: #302e22;
--color-citrine-white-950: #1c1b11;
}SCSS
$citrine-white: #faf7d6;
$citrine-white-rgb: 250, 247, 214;
$citrine-white-light: mix(#fff, $citrine-white, 20%);
$citrine-white-dark: mix(#000, $citrine-white, 20%);
.element {
color: $citrine-white;
box-shadow: 0 0 0 2px rgba($citrine-white, 0.35);
}