色名 · #FAE9E1
Diminished Orange
Diminished Orangeは#FAE9E1：rgb(250 233 225)、hsl(19 71% 93%)、oklch(0.945 0.021 47)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Diminished Orange color name →
#FAE9E1
oklch(0.945 0.021 47)
カラー変換
- HEX
- #fae9e1
- RGB
- rgb(250 233 225)
- HSL
- hsl(19 71% 93%)
- HWB
- hwb(19 88% 2%)
- OKLCH
- oklch(0.945 0.021 47)
- OKLab
- oklab(0.945 0.015 0.016)
- CIE Lab
- lab(93.56 4.99 6.09)
- LCH
- lch(93.56 7.87 50.7)
- CMYK
- cmyk(0% 7% 10% 2%)
ティント · シェード · トーン
ティント
- FBEBE4
- FBEDE7
- FCF0EA
- FCF2ED
- FDF4F0
- FDF6F3
- FEF8F6
- FEFBF9
- FFFDFC
シェード
- D9CBC4
- BAADA7
- 9B908B
- 7D7470
- 615A56
- 46413E
- 2D2927
- 151312
- 030302
トーン
- EDDED7
- E0D3CD
- D4C8C3
- C7BEB9
- BBB3AF
- AFA9A6
- A39E9C
- 979493
- 8C8A89
カラーハーモニー
補色 +180°
- FAE9E1
Diminished Orange
- DFF0F8
≈ Wizard White
類似色 -30° +30°
- FAE9E1
Diminished Orange
- FBE8E8
≈ Unburdened Pink
- F5EBDD
≈ Cotton Sheets
トライアド +120° +240°
- FAE9E1
Diminished Orange
- E0F2EA
≈ Paradise
- EBEBFB
≈ Bright Dusk
スプリットコンプリメンタリー +150° +210°
- FAE9E1
Diminished Orange
- DDF2F2
≈ Soar
- E4EEFC
≈ Cotton Boll
テトラード +90° +180° +270°
- FAE9E1
Diminished Orange
- E6F1E3
≈ Spearmint Stick
- DFF0F8
≈ Wizard White
- F3E9F7
≈ Perfume Haze
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.17:1 · APCA Lc 9
Ag
AAA黒の上
WCAG 17.80:1 · APCA Lc 96
最適な文字色: #000000
WCAG 17.80:1 (AAA) · APCA Lc 96
Contrast pairs
コードスニペット
CSS
:root {
--diminished-orange: #fae9e1;
--diminished-orange-rgb: 250 233 225;
--diminished-orange-oklch: oklch(0.945 0.021 47);
}
.element {
color: var(--diminished-orange);
background-color: hsl(19 71% 93%);
border-color: oklch(0.945 0.021 47);
}Tailwind CSS v4
@theme {
--color-diminished-orange: #fae9e1;
--color-diminished-orange-50: #fbf3f0;
--color-diminished-orange-100: #eee6e2;
--color-diminished-orange-200: #dcd2cc;
--color-diminished-orange-300: #c1b4ae;
--color-diminished-orange-400: #aa9b94;
--color-diminished-orange-500: #93827a;
--color-diminished-orange-600: #7c6e68;
--color-diminished-orange-700: #635853;
--color-diminished-orange-800: #49403c;
--color-diminished-orange-900: #332c29;
--color-diminished-orange-950: #1e1917;
}SCSS
$diminished-orange: #fae9e1;
$diminished-orange-rgb: 250, 233, 225;
$diminished-orange-light: mix(#fff, $diminished-orange, 20%);
$diminished-orange-dark: mix(#000, $diminished-orange, 20%);
.element {
color: $diminished-orange;
box-shadow: 0 0 0 2px rgba($diminished-orange, 0.35);
}