色名 · #E26D28
Lusty Orange
Lusty Orangeは#E26D28：rgb(226 109 40)、hsl(22 76% 52%)、oklch(0.664 0.165 46.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Lusty Orange color name →
#E26D28
oklch(0.664 0.165 46.9)
カラー変換
- HEX
- #e26d28
- RGB
- rgb(226 109 40)
- HSL
- hsl(22 76% 52%)
- HWB
- hwb(22 16% 11%)
- OKLCH
- oklch(0.664 0.165 46.9)
- OKLab
- oklab(0.664 0.113 0.121)
- CIE Lab
- lab(59.9 43.73 57.58)
- LCH
- lch(59.9 72.3 52.8)
- CMYK
- cmyk(0% 52% 82% 11%)
ティント · シェード · トーン
ティント
- E77D44
- EB8C5C
- EF9B71
- F3AA86
- F6B89A
- F8C6AE
- FBD5C2
- FDE3D7
- FEF1EB
シェード
- C45E21
- A84F1B
- 8C4115
- 71330F
- 572609
- 3E1904
- 270D02
- 120401
- 030100
トーン
- D97037
- D07343
- C6764D
- BD7856
- B37A5E
- AA7C66
- A07D6D
- 967E73
- 8B7F7A
カラーハーモニー
補色 +180°
- E26D28
Lusty Orange
- 00A2D0
≈ Charybdis
類似色 -30° +30°
- E26D28
Lusty Orange
- E6616E
≈ Purehearted
- C28600
≈ Bubonic Brown
トライアド +120° +240°
- E26D28
Lusty Orange
- 00AD81
≈ Simply Green
- 8E80F2
≈ Periwinkle
スプリットコンプリメンタリー +150° +210°
- E26D28
Lusty Orange
- 00A8AB
≈ Fiji
- 4A93F6
≈ Polar Glow
テトラード +90° +180° +270°
- E26D28
Lusty Orange
- 5EA939
≈ Ballyhoo
- 00A2D0
≈ Charybdis
- BB6FD5
≈ Lavender
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.25:1 · APCA Lc 59
Ag
AA黒の上
WCAG 6.45:1 · APCA Lc 43
最適な文字色: #000000
WCAG 6.45:1 (AA) · APCA Lc 43
Contrast pairs
コードスニペット
CSS
:root {
--lusty-orange: #e26d28;
--lusty-orange-rgb: 226 109 40;
--lusty-orange-oklch: oklch(0.664 0.165 46.9);
}
.element {
color: var(--lusty-orange);
background-color: hsl(22 76% 52%);
border-color: oklch(0.664 0.165 46.9);
}Tailwind CSS v4
@theme {
--color-lusty-orange: #e26d28;
--color-lusty-orange-50: #ffe8cc;
--color-lusty-orange-100: #ffd8b8;
--color-lusty-orange-200: #ffbf95;
--color-lusty-orange-300: #fb9c68;
--color-lusty-orange-400: #eb7b3e;
--color-lusty-orange-500: #d95900;
--color-lusty-orange-600: #b74c00;
--color-lusty-orange-700: #943d00;
--color-lusty-orange-800: #6e2a02;
--color-lusty-orange-900: #4e1d02;
--color-lusty-orange-950: #330c00;
}SCSS
$lusty-orange: #e26d28;
$lusty-orange-rgb: 226, 109, 40;
$lusty-orange-light: mix(#fff, $lusty-orange, 20%);
$lusty-orange-dark: mix(#000, $lusty-orange, 20%);
.element {
color: $lusty-orange;
box-shadow: 0 0 0 2px rgba($lusty-orange, 0.35);
}