色名 · #FF750F
March Hare Orange
March Hare Orangeは#FF750F：rgb(255 117 15)、hsl(26 100% 53%)、oklch(0.716 0.192 47.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · March Hare Orange color name →
#FF750F
oklch(0.716 0.192 47.8)
カラー変換
- HEX
- #ff750f
- RGB
- rgb(255 117 15)
- HSL
- hsl(26 100% 53%)
- HWB
- hwb(26 6% 0%)
- OKLCH
- oklch(0.716 0.192 47.8)
- OKLab
- oklab(0.716 0.129 0.142)
- CIE Lab
- lab(65.77 50.63 71.5)
- LCH
- lch(65.77 87.61 54.7)
- CMYK
- cmyk(0% 54% 94% 0%)
ティント · シェード · トーン
ティント
- FF853C
- FF9457
- FFA26F
- FFB085
- FFBE9A
- FFCBAE
- FFD8C2
- FFE5D7
- FFF2EB
シェード
- DE650B
- BE5508
- 9E4605
- 803703
- 632902
- 481C01
- 2E0F00
- 160500
- 030100
トーン
- F3782C
- E77A3D
- DA7C49
- CE7E54
- C27F5D
- B58065
- A8806C
- 9B8173
- 8E807A
カラーハーモニー
補色 +180°
- FF750F
March Hare Orange
- 00B3E7
≈ Blue Atoll
類似色 -30° +30°
- FF750F
March Hare Orange
- FF6C79
≈ Begonia
- D69500
≈ Bonfire Glow
トライアド +120° +240°
- FF750F
March Hare Orange
- 00C092
≈ Blarney
- A091FF
≈ Cobalite
スプリットコンプリメンタリー +150° +210°
- FF750F
March Hare Orange
- 00BABF
≈ Caicos Turquoise
- 65A4FF
≈ Âbi Blue
テトラード +90° +180° +270°
- FF750F
March Hare Orange
- 60BE36
≈ Exit Light
- 00B3E7
≈ Blue Atoll
- D477F0
≈ Calypso Orchid
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.69:1 · APCA Lc 51
Ag
AAA黒の上
WCAG 7.80:1 · APCA Lc 50
最適な文字色: #000000
WCAG 7.80:1 (AAA) · APCA Lc 50
Contrast pairs
コードスニペット
CSS
:root {
--march-hare-orange: #ff750f;
--march-hare-orange-rgb: 255 117 15;
--march-hare-orange-oklch: oklch(0.716 0.192 47.8);
}
.element {
color: var(--march-hare-orange);
background-color: hsl(26 100% 53%);
border-color: oklch(0.716 0.192 47.8);
}Tailwind CSS v4
@theme {
--color-march-hare-orange: #ff750f;
--color-march-hare-orange-50: #ffe6c5;
--color-march-hare-orange-100: #ffd6af;
--color-march-hare-orange-200: #ffbc88;
--color-march-hare-orange-300: #ff9756;
--color-march-hare-orange-400: #f5731b;
--color-march-hare-orange-500: #e44d00;
--color-march-hare-orange-600: #c14200;
--color-march-hare-orange-700: #9b3500;
--color-march-hare-orange-800: #742400;
--color-march-hare-orange-900: #521800;
--color-march-hare-orange-950: #370700;
}SCSS
$march-hare-orange: #ff750f;
$march-hare-orange-rgb: 255, 117, 15;
$march-hare-orange-light: mix(#fff, $march-hare-orange, 20%);
$march-hare-orange-dark: mix(#000, $march-hare-orange, 20%);
.element {
color: $march-hare-orange;
box-shadow: 0 0 0 2px rgba($march-hare-orange, 0.35);
}