이름 색상 · #F8AD1B
Tangerine Twist
Tangerine Twist은(는) #F8AD1B: rgb(248 173 27), hsl(40 94% 54%), oklch(0.8 0.163 76.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · Tangerine Twist color name →
#F8AD1B
oklch(0.8 0.163 76.4)
색상 변환
- HEX
- #f8ad1b
- RGB
- rgb(248 173 27)
- HSL
- hsl(40 94% 54%)
- HWB
- hwb(40 11% 3%)
- OKLCH
- oklch(0.8 0.163 76.4)
- OKLab
- oklab(0.8 0.038 0.158)
- CIE Lab
- lab(76.62 20.83 75.54)
- LCH
- lch(76.62 78.36 74.6)
- CMYK
- cmyk(0% 30% 89% 3%)
틴트 · 셰이드 · 톤
틴트
- F9B646
- FABE61
- FCC778
- FCCF8D
- FDD7A1
- FEE0B5
- FEE8C8
- FFEFDA
- FFF7ED
셰이드
- D89616
- B87F11
- 9A6A0C
- 7C5508
- 604105
- 452D02
- 2C1B01
- 150B00
- 030100
톤
- ECA935
- E0A545
- D3A151
- C79C5B
- BB9863
- AF936B
- A48F71
- 988A76
- 8C857B
색 조화
보색 +180°
- F8AD1B
Tangerine Twist
- 92C0FF
≈ Truesky Gloxym
유사색 -30° +30°
- F8AD1B
Tangerine Twist
- FFA477
≈ Young Tangerine
- CBC324
≈ Bird Flower
삼각 배색 +120° +240°
- F8AD1B
Tangerine Twist
- 00D8DB
≈ Aztec Turquoise
- E49DFF
≈ Medium Lavender Magenta
분열 보색 +150° +210°
- F8AD1B
Tangerine Twist
- 46CEFF
≈ Thor’s Thunder
- B8B4FF
≈ Greyish Lavender
사각 배색 +90° +180° +270°
- F8AD1B
Tangerine Twist
- 15DEA6
≈ Malted Mint Madness
- 92C0FF
≈ Truesky Gloxym
- FF96D0
≈ Himalayan Balsam
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.91:1 · APCA Lc 36
Ag
AAA검은색 위
WCAG 10.98:1 · APCA Lc 66
가장 좋은 글자색: #000000
WCAG 10.98:1 (AAA) · APCA Lc 66
Contrast pairs
코드 스니펫
CSS
:root {
--tangerine-twist: #f8ad1b;
--tangerine-twist-rgb: 248 173 27;
--tangerine-twist-oklch: oklch(0.8 0.163 76.4);
}
.element {
color: var(--tangerine-twist);
background-color: hsl(40 94% 54%);
border-color: oklch(0.8 0.163 76.4);
}Tailwind CSS v4
@theme {
--color-tangerine-twist: #f8ad1b;
--color-tangerine-twist-50: #fff0c1;
--color-tangerine-twist-100: #ffe2aa;
--color-tangerine-twist-200: #facc82;
--color-tangerine-twist-300: #e4ac4b;
--color-tangerine-twist-400: #d48f00;
--color-tangerine-twist-500: #c17200;
--color-tangerine-twist-600: #a36100;
--color-tangerine-twist-700: #834d00;
--color-tangerine-twist-800: #623700;
--color-tangerine-twist-900: #452600;
--color-tangerine-twist-950: #2d1400;
}SCSS
$tangerine-twist: #f8ad1b;
$tangerine-twist-rgb: 248, 173, 27;
$tangerine-twist-light: mix(#fff, $tangerine-twist, 20%);
$tangerine-twist-dark: mix(#000, $tangerine-twist, 20%);
.element {
color: $tangerine-twist;
box-shadow: 0 0 0 2px rgba($tangerine-twist, 0.35);
}