이름 색상 · #FF7538
Synthetic Pumpkin
Synthetic Pumpkin은(는) #FF7538: rgb(255 117 56), hsl(18 100% 61%), oklch(0.718 0.184 42.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Synthetic Pumpkin color name →
#FF7538
oklch(0.718 0.184 42.3)
색상 변환
- HEX
- #ff7538
- RGB
- rgb(255 117 56)
- HSL
- hsl(18 100% 61%)
- HWB
- hwb(18 22% 0%)
- OKLCH
- oklch(0.718 0.184 42.3)
- OKLab
- oklab(0.718 0.136 0.124)
- CIE Lab
- lab(65.94 51.24 58.05)
- LCH
- lch(65.94 77.43 48.6)
- CMYK
- cmyk(0% 54% 78% 0%)
틴트 · 셰이드 · 톤
틴트
- FF8551
- FF9367
- FFA27B
- FFB08E
- FFBDA1
- FFCBB4
- FFD8C7
- FFE5D9
- FFF2EC
셰이드
- DE652F
- BE5527
- 9E461F
- 803717
- 63290F
- 481C08
- 2E0F04
- 160501
- 030100
톤
- F37844
- E77A4E
- DA7C56
- CE7E5E
- C27F65
- B5806B
- A88071
- 9B8076
- 8E807B
색 조화
보색 +180°
- FF7538
Synthetic Pumpkin
- 00B5E0
≈ Blue Atoll
유사색 -30° +30°
- FF7538
Synthetic Pumpkin
- FF6C85
≈ Ultra Red
- DE9200
≈ Beige Red
삼각 배색 +120° +240°
- FF7538
Synthetic Pumpkin
- 00C286
≈ Píng Gǔo Lǜ Green
- 9796FF
≈ Cobalite
분열 보색 +150° +210°
- FF7538
Synthetic Pumpkin
- 00BCB8
≈ Jade Gravel
- 57A8FF
≈ Âbi Blue
사각 배색 +90° +180° +270°
- FF7538
Synthetic Pumpkin
- 76BB2A
≈ Jubilant Meadow
- 00B5E0
≈ Blue Atoll
- CA7DF5
≈ Azuremyst Isle
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.67:1 · APCA Lc 51
Ag
AAA검은색 위
WCAG 7.85:1 · APCA Lc 51
가장 좋은 글자색: #000000
WCAG 7.85:1 (AAA) · APCA Lc 51
Contrast pairs
코드 스니펫
CSS
:root {
--synthetic-pumpkin: #ff7538;
--synthetic-pumpkin-rgb: 255 117 56;
--synthetic-pumpkin-oklch: oklch(0.718 0.184 42.3);
}
.element {
color: var(--synthetic-pumpkin);
background-color: hsl(18 100% 61%);
border-color: oklch(0.718 0.184 42.3);
}Tailwind CSS v4
@theme {
--color-synthetic-pumpkin: #ff7538;
--color-synthetic-pumpkin-50: #ffe5cb;
--color-synthetic-pumpkin-100: #ffd5b6;
--color-synthetic-pumpkin-200: #ffbb93;
--color-synthetic-pumpkin-300: #ff9665;
--color-synthetic-pumpkin-400: #f5733a;
--color-synthetic-pumpkin-500: #e34c00;
--color-synthetic-pumpkin-600: #c04200;
--color-synthetic-pumpkin-700: #9a3500;
--color-synthetic-pumpkin-800: #742400;
--color-synthetic-pumpkin-900: #521801;
--color-synthetic-pumpkin-950: #360800;
}SCSS
$synthetic-pumpkin: #ff7538;
$synthetic-pumpkin-rgb: 255, 117, 56;
$synthetic-pumpkin-light: mix(#fff, $synthetic-pumpkin, 20%);
$synthetic-pumpkin-dark: mix(#000, $synthetic-pumpkin, 20%);
.element {
color: $synthetic-pumpkin;
box-shadow: 0 0 0 2px rgba($synthetic-pumpkin, 0.35);
}