Màu có tên · #E56131
Startling Orange
Startling Orange là #E56131: rgb(229 97 49), hsl(16 78% 55%), oklch(0.652 0.175 39.3). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Red mean? → · Startling Orange color name →
#E56131
oklch(0.652 0.175 39.3)
Chuyển đổi màu
- HEX
- #e56131
- RGB
- rgb(229 97 49)
- HSL
- hsl(16 78% 55%)
- HWB
- hwb(16 19% 10%)
- OKLCH
- oklch(0.652 0.175 39.3)
- OKLab
- oklab(0.652 0.136 0.111)
- CIE Lab
- lab(58.22 50.53 52.42)
- LCH
- lch(58.22 72.81 46.1)
- CMYK
- cmyk(0% 58% 79% 10%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- EA734A
- EE835F
- F29474
- F5A388
- F8B39C
- FBC2AF
- FDD2C3
- FEE1D7
- FFF0EB
Sắc đậm
- C75329
- AA4622
- 8E391A
- 722D13
- 58210C
- 3F1506
- 280B03
- 120301
- 030000
Sắc xám
- DC663D
- D26B47
- C96F50
- BF7258
- B67560
- AC7867
- A17A6D
- 977D74
- 8C7E7A
Hòa sắc
Bổ túc +180°
- E56131
Startling Orange
- 00A0C1
≈ Delos Blue
Tương đồng -30° +30°
- E56131
Startling Orange
- E55878
≈ Highlighter Pink
- C67D00
≈ Bamboo Brown
Bộ ba +120° +240°
- E56131
Startling Orange
- 00AA6E
≈ Banaue Jade
- 7C7FF7
≈ Orchid
Bổ túc chia +150° +210°
- E56131
Startling Orange
- 00A59E
≈ Jadestone
- 1493F5
≈ Karimun Blue
Bộ bốn +90° +180° +270°
- E56131
Startling Orange
- 6DA300
≈ Herbal Lift
- 00A0C1
≈ Delos Blue
- AF6CDF
≈ Lavender
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 3.45:1 · APCA Lc 61
Ag
AATrên nền đen
WCAG 6.08:1 · APCA Lc 40
Màu chữ tốt nhất: #000000
WCAG 6.08:1 (AA) · APCA Lc 40
Contrast pairs
Đoạn mã
CSS
:root {
--startling-orange: #e56131;
--startling-orange-rgb: 229 97 49;
--startling-orange-oklch: oklch(0.652 0.175 39.3);
}
.element {
color: var(--startling-orange);
background-color: hsl(16 78% 55%);
border-color: oklch(0.652 0.175 39.3);
}Tailwind CSS v4
@theme {
--color-startling-orange: #e56131;
--color-startling-orange-50: #ffe5cf;
--color-startling-orange-100: #ffd5bb;
--color-startling-orange-200: #ffbb99;
--color-startling-orange-300: #ff976e;
--color-startling-orange-400: #f27448;
--color-startling-orange-500: #e14f0c;
--color-startling-orange-600: #be4411;
--color-startling-orange-700: #99360e;
--color-startling-orange-800: #72250c;
--color-startling-orange-900: #511908;
--color-startling-orange-950: #350800;
}SCSS
$startling-orange: #e56131;
$startling-orange-rgb: 229, 97, 49;
$startling-orange-light: mix(#fff, $startling-orange, 20%);
$startling-orange-dark: mix(#000, $startling-orange, 20%);
.element {
color: $startling-orange;
box-shadow: 0 0 0 2px rgba($startling-orange, 0.35);
}