이름 색상 · #F59D59
Bergamot Orange
Bergamot Orange은(는) #F59D59: rgb(245 157 89), hsl(26 89% 65%), oklch(0.772 0.134 56.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · Bergamot Orange color name →
#F59D59
oklch(0.772 0.134 56.7)
색상 변환
- HEX
- #f59d59
- RGB
- rgb(245 157 89)
- HSL
- hsl(26 89% 65%)
- HWB
- hwb(26 35% 4%)
- OKLCH
- oklch(0.772 0.134 56.7)
- OKLab
- oklab(0.772 0.074 0.112)
- CIE Lab
- lab(72.95 29.3 49.14)
- LCH
- lch(72.95 57.21 59.2)
- CMYK
- cmyk(0% 36% 64% 4%)
틴트 · 셰이드 · 톤
틴트
- F7A76C
- F9B17D
- FABB8E
- FCC59F
- FDCFAF
- FED9BF
- FEE2CF
- FFECDF
- FFF5EF
셰이드
- D5884C
- B67340
- 985F34
- 7B4C28
- 5F3A1D
- 442813
- 2B1809
- 150903
- 030100
톤
- E99B5F
- DE9864
- D29569
- C6936E
- BB9071
- AF8D75
- A38A78
- 98877B
- 8C837E
색 조화
보색 +180°
- F59D59
Bergamot Orange
- 51C1FF
≈ Hello Summer
유사색 -30° +30°
- F59D59
Bergamot Orange
- FF9186
≈ Desert Flower
- DAAE40
≈ Yarrow
삼각 배색 +120° +240°
- F59D59
Bergamot Orange
- 2ED0B3
≈ Mint Leaf
- BDA2FF
≈ Diva
분열 보색 +150° +210°
- F59D59
Bergamot Orange
- 00CCDF
≈ Picnic Day Sky
- 93B3FF
≈ Carolina Blue
사각 배색 +90° +180° +270°
- F59D59
Bergamot Orange
- 77CC81
≈ Serengeti Green
- 51C1FF
≈ Hello Summer
- E295E2
≈ Love Dust
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.13:1 · APCA Lc 42
Ag
AAA검은색 위
WCAG 9.84:1 · APCA Lc 61
가장 좋은 글자색: #000000
WCAG 9.84:1 (AAA) · APCA Lc 61
Contrast pairs
코드 스니펫
CSS
:root {
--bergamot-orange: #f59d59;
--bergamot-orange-rgb: 245 157 89;
--bergamot-orange-oklch: oklch(0.772 0.134 56.7);
}
.element {
color: var(--bergamot-orange);
background-color: hsl(26 89% 65%);
border-color: oklch(0.772 0.134 56.7);
}Tailwind CSS v4
@theme {
--color-bergamot-orange: #f59d59;
--color-bergamot-orange-50: #ffedd0;
--color-bergamot-orange-100: #ffdebc;
--color-bergamot-orange-200: #ffc79b;
--color-bergamot-orange-300: #eba670;
--color-bergamot-orange-400: #da8848;
--color-bergamot-orange-500: #c76a0a;
--color-bergamot-orange-600: #a85b10;
--color-bergamot-orange-700: #87480d;
--color-bergamot-orange-800: #65330a;
--color-bergamot-orange-900: #472306;
--color-bergamot-orange-950: #2e1200;
}SCSS
$bergamot-orange: #f59d59;
$bergamot-orange-rgb: 245, 157, 89;
$bergamot-orange-light: mix(#fff, $bergamot-orange, 20%);
$bergamot-orange-dark: mix(#000, $bergamot-orange, 20%);
.element {
color: $bergamot-orange;
box-shadow: 0 0 0 2px rgba($bergamot-orange, 0.35);
}