色名 · #ECAA79
Apricot Nectar
Apricot Nectarは#ECAA79：rgb(236 170 121)、hsl(26 75% 70%)、oklch(0.79 0.101 57.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Apricot Nectar color name →
#ECAA79
oklch(0.79 0.101 57.3)
カラー変換
- HEX
- #ecaa79
- RGB
- rgb(236 170 121)
- HSL
- hsl(26 75% 70%)
- HWB
- hwb(26 47% 7%)
- OKLCH
- oklch(0.79 0.101 57.3)
- OKLab
- oklab(0.79 0.055 0.085)
- CIE Lab
- lab(75.23 20.92 35.3)
- LCH
- lch(75.23 41.03 59.3)
- CMYK
- cmyk(0% 28% 49% 7%)
ティント · シェード · トーン
ティント
- EEB387
- F1BB94
- F3C4A2
- F5CCAF
- F7D5BC
- F9DDCA
- FBE6D7
- FCEEE4
- FEF7F2
シェード
- CD9368
- AF7D58
- 926848
- 765339
- 5B3F2B
- 422D1D
- 291B10
- 130B05
- 030101
トーン
- E1A67B
- D6A27C
- CB9E7D
- C09A7E
- B6957F
- AB917F
- A08D80
- 958980
- 8B8480
カラーハーモニー
補色 +180°
- ECAA79
Apricot Nectar
- 79C4F3
≈ Nevermind Nirvana
類似色 -30° +30°
- ECAA79
Apricot Nectar
- F5A197
≈ Pink Eraser
- D6B76C
≈ Golden Pagoda
トライアド +120° +240°
- ECAA79
Apricot Nectar
- 6BD0B9
≈ Jamaican Jade
- C1ADF4
≈ Purple Sand
スプリットコンプリメンタリー +150° +210°
- ECAA79
Apricot Nectar
- 61CDDB
≈ Watercourse
- 9EB9FC
≈ Truesky Gloxym
テトラード +90° +180° +270°
- ECAA79
Apricot Nectar
- 8ECC95
≈ Fennel
- 79C4F3
≈ Nevermind Nirvana
- DEA4DC
≈ Plum Juice
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.98:1 · APCA Lc 38
Ag
AAA黒の上
WCAG 10.59:1 · APCA Lc 64
最適な文字色: #000000
WCAG 10.59:1 (AAA) · APCA Lc 64
Contrast pairs
コードスニペット
CSS
:root {
--apricot-nectar: #ecaa79;
--apricot-nectar-rgb: 236 170 121;
--apricot-nectar-oklch: oklch(0.79 0.101 57.3);
}
.element {
color: var(--apricot-nectar);
background-color: hsl(26 75% 70%);
border-color: oklch(0.79 0.101 57.3);
}Tailwind CSS v4
@theme {
--color-apricot-nectar: #ecaa79;
--color-apricot-nectar-50: #ffefd9;
--color-apricot-nectar-100: #ffe1c7;
--color-apricot-nectar-200: #f6cbaa;
--color-apricot-nectar-300: #dfab83;
--color-apricot-nectar-400: #cc8f61;
--color-apricot-nectar-500: #b8743d;
--color-apricot-nectar-600: #9b6235;
--color-apricot-nectar-700: #7d4e2a;
--color-apricot-nectar-800: #5d381e;
--color-apricot-nectar-900: #412713;
--color-apricot-nectar-950: #2a1505;
}SCSS
$apricot-nectar: #ecaa79;
$apricot-nectar-rgb: 236, 170, 121;
$apricot-nectar-light: mix(#fff, $apricot-nectar, 20%);
$apricot-nectar-dark: mix(#000, $apricot-nectar, 20%);
.element {
color: $apricot-nectar;
box-shadow: 0 0 0 2px rgba($apricot-nectar, 0.35);
}