色名 · #FFDEA9
Horseradish Yellow
Horseradish Yellowは#FFDEA9：rgb(255 222 169)、hsl(37 100% 83%)、oklch(0.916 0.077 79.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Horseradish Yellow color name →
#FFDEA9
oklch(0.916 0.077 79.3)
カラー変換
- HEX
- #ffdea9
- RGB
- rgb(255 222 169)
- HSL
- hsl(37 100% 83%)
- HWB
- hwb(37 66% 0%)
- OKLCH
- oklch(0.916 0.077 79.3)
- OKLab
- oklab(0.916 0.014 0.076)
- CIE Lab
- lab(90.33 6.38 30.5)
- LCH
- lch(90.33 31.16 78.2)
- CMYK
- cmyk(0% 13% 34% 0%)
ティント · シェード · トーン
ティント
- FFE1B2
- FFE5BB
- FFE8C3
- FFEBCC
- FFEFD5
- FFF2DD
- FFF5E6
- FFF9EE
- FFFCF7
シェード
- DEC192
- BEA57C
- 9E8967
- 806F53
- 63553F
- 483D2C
- 2E261B
- 16120A
- 030201
トーン
- F2D4A5
- E4CBA1
- D7C19D
- CAB899
- BEAE95
- B1A591
- A59B8D
- 989289
- 8C8984
カラーハーモニー
補色 +180°
- FFDEA9
Horseradish Yellow
- D3E4FF
≈ Veiling Waterfalls
類似色 -30° +30°
- FFDEA9
Horseradish Yellow
- FFDBC7
≈ Sugared Peach
- E6E8AC
≈ Kiwi Ice Cream
トライアド +120° +240°
- FFDEA9
Horseradish Yellow
- A4F3F7
≈ Waterspout
- F7D6FF
≈ Pink Diamond
スプリットコンプリメンタリー +150° +210°
- FFDEA9
Horseradish Yellow
- C1EAFF
≈ Blue Java Banana
- E2DFFF
≈ Stoic White
テトラード +90° +180° +270°
- FFDEA9
Horseradish Yellow
- B0F4DB
≈ Mintie
- D3E4FF
≈ Veiling Waterfalls
- FFD6E8
≈ Pink Currant
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.29:1 · APCA Lc 14
Ag
AAA黒の上
WCAG 16.27:1 · APCA Lc 89
最適な文字色: #000000
WCAG 16.27:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--horseradish-yellow: #ffdea9;
--horseradish-yellow-rgb: 255 222 169;
--horseradish-yellow-oklch: oklch(0.916 0.077 79.3);
}
.element {
color: var(--horseradish-yellow);
background-color: hsl(37 100% 83%);
border-color: oklch(0.916 0.077 79.3);
}Tailwind CSS v4
@theme {
--color-horseradish-yellow: #ffdea9;
--color-horseradish-yellow-50: #fff3dd;
--color-horseradish-yellow-100: #f5e6cc;
--color-horseradish-yellow-200: #e5d2b0;
--color-horseradish-yellow-300: #ccb48b;
--color-horseradish-yellow-400: #b79a6a;
--color-horseradish-yellow-500: #a28048;
--color-horseradish-yellow-600: #896d3e;
--color-horseradish-yellow-700: #6d5731;
--color-horseradish-yellow-800: #513f22;
--color-horseradish-yellow-900: #392b17;
--color-horseradish-yellow-950: #231908;
}SCSS
$horseradish-yellow: #ffdea9;
$horseradish-yellow-rgb: 255, 222, 169;
$horseradish-yellow-light: mix(#fff, $horseradish-yellow, 20%);
$horseradish-yellow-dark: mix(#000, $horseradish-yellow, 20%);
.element {
color: $horseradish-yellow;
box-shadow: 0 0 0 2px rgba($horseradish-yellow, 0.35);
}