色名 · #F94D00
Tangelo
Tangeloは#F94D00：rgb(249 77 0)、hsl(19 100% 49%)、oklch(0.658 0.218 37.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Tangelo color name →
#F94D00
oklch(0.658 0.218 37.4)
カラー変換
- HEX
- #f94d00
- RGB
- rgb(249 77 0)
- HSL
- hsl(19 100% 49%)
- HWB
- hwb(19 0% 2%)
- OKLCH
- oklch(0.658 0.218 37.4)
- OKLab
- oklab(0.658 0.173 0.133)
- CIE Lab
- lab(58.41 64.68 70.04)
- LCH
- lch(58.41 95.33 47.3)
- CMYK
- cmyk(0% 69% 100% 2%)
ティント · シェード · トーン
ティント
- FD6434
- FF7850
- FF8B68
- FF9D7E
- FFAE94
- FFBFA9
- FFCFBF
- FFDFD4
- FFEFE9
シェード
- D94200
- B93700
- 9A2C00
- 7D2200
- 611800
- 460F00
- 2C0700
- 150200
- 030000
トーン
- EE5724
- E35F36
- D86543
- CC6B4E
- C17058
- B57461
- A87869
- 9C7B71
- 8E7E79
カラーハーモニー
補色 +180°
- F94D00
Tangelo
- 00A2C1
≈ Scuba Blue
類似色 -30° +30°
- F94D00
Tangelo
- F74279
≈ Diva Pink
- CB7D00
≈ Seabuckthorn Yellow Brown
トライアド +120° +240°
- F94D00
Tangelo
- 00AD6A
≈ Go Green!
- 7981FF
≈ Orchid
スプリットコンプリメンタリー +150° +210°
- F94D00
Tangelo
- 00A89E
≈ Tropical Hideaway
- 0097F5
≈ Karimun Blue
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.44:1 · APCA Lc 61
Ag
AA黒の上
WCAG 6.08:1 · APCA Lc 41
最適な文字色: #000000
WCAG 6.08:1 (AA) · APCA Lc 41
Contrast pairs
コードスニペット
CSS
:root {
--tangelo: #f94d00;
--tangelo-rgb: 249 77 0;
--tangelo-oklch: oklch(0.658 0.218 37.4);
}
.element {
color: var(--tangelo);
background-color: hsl(19 100% 49%);
border-color: oklch(0.658 0.218 37.4);
}Tailwind CSS v4
@theme {
--color-tangelo: #f94d00;
--color-tangelo-50: #ffe1c7;
--color-tangelo-100: #ffcfb1;
--color-tangelo-200: #ffb28c;
--color-tangelo-300: #ff8b5c;
--color-tangelo-400: #ff622d;
--color-tangelo-500: #f42d00;
--color-tangelo-600: #ce2a00;
--color-tangelo-700: #a62200;
--color-tangelo-800: #7c1500;
--color-tangelo-900: #580e00;
--color-tangelo-950: #3b0000;
}SCSS
$tangelo: #f94d00;
$tangelo-rgb: 249, 77, 0;
$tangelo-light: mix(#fff, $tangelo, 20%);
$tangelo-dark: mix(#000, $tangelo, 20%);
.element {
color: $tangelo;
box-shadow: 0 0 0 2px rgba($tangelo, 0.35);
}