Màu có tên · #FF5630
Poppy Surprise
Poppy Surprise là #FF5630: rgb(255 86 48), hsl(11 100% 59%), oklch(0.679 0.211 34). 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? → · Poppy Surprise color name →
#FF5630
oklch(0.679 0.211 34)
Chuyển đổi màu
- HEX
- #ff5630
- RGB
- rgb(255 86 48)
- HSL
- hsl(11 100% 59%)
- HWB
- hwb(11 19% 0%)
- OKLCH
- oklch(0.679 0.211 34)
- OKLab
- oklab(0.679 0.175 0.118)
- CIE Lab
- lab(60.87 63.86 57.22)
- LCH
- lch(60.87 85.74 41.9)
- CMYK
- cmyk(0% 66% 81% 0%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- FF6B4A
- FF7E60
- FF9075
- FFA189
- FFB19D
- FFC1B0
- FFD1C4
- FFE0D8
- FFF0EB
Sắc đậm
- DE4A28
- BE3E21
- 9E321A
- 802713
- 631C0C
- 481206
- 2E0803
- 160201
- 030000
Sắc xám
- F35E3D
- E86547
- DC6A51
- D06F59
- C37360
- B77767
- AA7A6E
- 9D7C74
- 8F7E7A
Hòa sắc
Bổ túc +180°
- FF5630
Poppy Surprise
- 00AAC5
≈ Sarah’s Garden
Tương đồng -30° +30°
- FF5630
Poppy Surprise
- FA4E89
≈ French Rose
- D88000
≈ Orange Pepper
Bộ ba +120° +240°
- FF5630
Poppy Surprise
- 00B565
≈ Future Hair
- 798CFF
≈ Punch Out Glove
Bổ túc chia +150° +210°
- FF5630
Poppy Surprise
- 00B0A0
≈ Billiard
- 00A0F6
≈ Button Blue
Bộ bốn +90° +180° +270°
- FF5630
Poppy Surprise
- 83A800
≈ Hillsbrad Grass
- 00AAC5
≈ Sarah’s Garden
- B56EFF
≈ Queer Purple
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 3.16:1 · APCA Lc 58
Ag
AATrên nền đen
WCAG 6.62:1 · APCA Lc 44
Màu chữ tốt nhất: #000000
WCAG 6.62:1 (AA) · APCA Lc 44
Contrast pairs
Đoạn mã
CSS
:root {
--poppy-surprise: #ff5630;
--poppy-surprise-rgb: 255 86 48;
--poppy-surprise-oklch: oklch(0.679 0.211 34);
}
.element {
color: var(--poppy-surprise);
background-color: hsl(11 100% 59%);
border-color: oklch(0.679 0.211 34);
}Tailwind CSS v4
@theme {
--color-poppy-surprise: #ff5630;
--color-poppy-surprise-50: #ffe0cc;
--color-poppy-surprise-100: #ffcfb7;
--color-poppy-surprise-200: #ffb294;
--color-poppy-surprise-300: #ff8b67;
--color-poppy-surprise-400: #ff633f;
--color-poppy-surprise-500: #f23000;
--color-poppy-surprise-600: #cc2c00;
--color-poppy-surprise-700: #a42300;
--color-poppy-surprise-800: #7b1706;
--color-poppy-surprise-900: #570f04;
--color-poppy-surprise-950: #3a0100;
}SCSS
$poppy-surprise: #ff5630;
$poppy-surprise-rgb: 255, 86, 48;
$poppy-surprise-light: mix(#fff, $poppy-surprise, 20%);
$poppy-surprise-dark: mix(#000, $poppy-surprise, 20%);
.element {
color: $poppy-surprise;
box-shadow: 0 0 0 2px rgba($poppy-surprise, 0.35);
}