色名 · #FFB16D
Apricot
Apricotは#FFB16D：rgb(255 177 109)、hsl(28 100% 71%)、oklch(0.821 0.124 60.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Apricot color name →
#FFB16D
oklch(0.821 0.124 60.8)
カラー変換
- HEX
- #ffb16d
- RGB
- rgb(255 177 109)
- HSL
- hsl(28 100% 71%)
- HWB
- hwb(28 43% 0%)
- OKLCH
- oklch(0.821 0.124 60.8)
- OKLab
- oklab(0.821 0.061 0.109)
- CIE Lab
- lab(78.87 24.33 46.41)
- LCH
- lch(78.87 52.4 62.3)
- CMYK
- cmyk(0% 31% 57% 0%)
ティント · シェード · トーン
ティント
- FFB97D
- FFC18C
- FFC99B
- FFD1AA
- FFD9B8
- FFE1C7
- FFE8D5
- FFF0E3
- FFF7F1
シェード
- DE995E
- BE834F
- 9E6C41
- 805733
- 634226
- 482F19
- 2E1C0D
- 160C04
- 030101
トーン
- F2AC71
- E5A874
- D8A376
- CC9E78
- BF997A
- B2947C
- A68F7D
- 998A7E
- 8D857F
カラーハーモニー
補色 +180°
- FFB16D
Apricot
- 88CDFF
≈ Platonic Blue
類似色 -30° +30°
- FFB16D
Apricot
- FFAC9D
≈ Pink Rose Bud
- E3C15E
≈ Candelabra
トライアド +120° +240°
- FFB16D
Apricot
- 52DFC9
≈ Jazzy Jade
- D0B5FF
≈ Light Violet
スプリットコンプリメンタリー +150° +210°
- FFB16D
Apricot
- 48DAF2
≈ Blue Dacnis
- AFC2FF
≈ Pastel Blue
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.78:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.76:1 · APCA Lc 70
最適な文字色: #000000
WCAG 11.76:1 (AAA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--apricot: #ffb16d;
--apricot-rgb: 255 177 109;
--apricot-oklch: oklch(0.821 0.124 60.8);
}
.element {
color: var(--apricot);
background-color: hsl(28 100% 71%);
border-color: oklch(0.821 0.124 60.8);
}Tailwind CSS v4
@theme {
--color-apricot: #ffb16d;
--color-apricot-50: #ffeed1;
--color-apricot-100: #ffe0be;
--color-apricot-200: #fbc99d;
--color-apricot-300: #e5a973;
--color-apricot-400: #d38c4c;
--color-apricot-500: #c06f17;
--color-apricot-600: #a25f18;
--color-apricot-700: #824c13;
--color-apricot-800: #61360d;
--color-apricot-900: #442508;
--color-apricot-950: #2c1300;
}SCSS
$apricot: #ffb16d;
$apricot-rgb: 255, 177, 109;
$apricot-light: mix(#fff, $apricot, 20%);
$apricot-dark: mix(#000, $apricot, 20%);
.element {
color: $apricot;
box-shadow: 0 0 0 2px rgba($apricot, 0.35);
}