色名 · #DE9408
Beige Red
Beige Redは#DE9408：rgb(222 148 8)、hsl(39 93% 45%)、oklch(0.723 0.152 73.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Beige Red color name →
#DE9408
oklch(0.723 0.152 73.3)
カラー変換
- HEX
- #de9408
- RGB
- rgb(222 148 8)
- HSL
- hsl(39 93% 45%)
- HWB
- hwb(39 3% 13%)
- OKLCH
- oklch(0.723 0.152 73.3)
- OKLab
- oklab(0.723 0.044 0.146)
- CIE Lab
- lab(67.65 22.31 70.9)
- LCH
- lch(67.65 74.33 72.5)
- CMYK
- cmyk(0% 33% 96% 13%)
ティント · シェード · トーン
ティント
- E29F3B
- E6AA57
- E9B56F
- EDC085
- F0CA9A
- F4D5AF
- F7E0C3
- FAEAD7
- FCF5EB
シェード
- C18006
- A56D04
- 895A03
- 6F4802
- 553601
- 3D2601
- 261600
- 120800
- 020100
トーン
- D5932B
- CB913C
- C28F49
- B98E54
- AF8C5D
- A68A65
- 9C876D
- 938574
- 8A837A
カラーハーモニー
補色 +180°
- DE9408
Beige Red
- 5DA9FF
≈ Âbi Blue
類似色 -30° +30°
- DE9408
Beige Red
- F38251
≈ Autumn Sunset
- B7A900
≈ Brass Knuckle
トライアド +120° +240°
- DE9408
Beige Red
- 00BDBB
≈ Jade Gravel
- C787E9
≈ Lavender Perceptions
スプリットコンプリメンタリー +150° +210°
- DE9408
Beige Red
- 00B7E3
≈ Blue Atoll
- 9A97FF
≈ Cobalite
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.51:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.34:1 · APCA Lc 53
最適な文字色: #000000
WCAG 8.34:1 (AAA) · APCA Lc 53
Contrast pairs
コードスニペット
CSS
:root {
--beige-red: #de9408;
--beige-red-rgb: 222 148 8;
--beige-red-oklch: oklch(0.723 0.152 73.3);
}
.element {
color: var(--beige-red);
background-color: hsl(39 93% 45%);
border-color: oklch(0.723 0.152 73.3);
}Tailwind CSS v4
@theme {
--color-beige-red: #de9408;
--color-beige-red-50: #fff0c5;
--color-beige-red-100: #ffe1af;
--color-beige-red-200: #fbcb89;
--color-beige-red-300: #e5ac57;
--color-beige-red-400: #d48e13;
--color-beige-red-500: #c17100;
--color-beige-red-600: #a36000;
--color-beige-red-700: #834d00;
--color-beige-red-800: #623700;
--color-beige-red-900: #452600;
--color-beige-red-950: #2c1400;
}SCSS
$beige-red: #de9408;
$beige-red-rgb: 222, 148, 8;
$beige-red-light: mix(#fff, $beige-red, 20%);
$beige-red-dark: mix(#000, $beige-red, 20%);
.element {
color: $beige-red;
box-shadow: 0 0 0 2px rgba($beige-red, 0.35);
}