diff --git a/src/categories/components/CategoryBackground/CategoryBackground.tsx b/src/categories/components/CategoryBackground/CategoryBackground.tsx
index ca042996e..8e340e304 100644
--- a/src/categories/components/CategoryBackground/CategoryBackground.tsx
+++ b/src/categories/components/CategoryBackground/CategoryBackground.tsx
@@ -77,6 +77,7 @@ const CategoryBackground: React.FC<CategoryBackgroundProps> = props => {
               onChange={event => onImageUpload(event.target.files[0])}
               type="file"
               ref={anchor}
+              accept="image/*"
             />
           </>
         }
@@ -90,7 +91,7 @@ const CategoryBackground: React.FC<CategoryBackgroundProps> = props => {
           </div>
         </CardContent>
       ) : image === null ? (
-        <ImageUpload onImageUpload={onImageUpload} />
+        <ImageUpload onImageUpload={files => onImageUpload(files[0])} />
       ) : (
         <CardContent>
           <ImageTile image={image} onImageDelete={onImageDelete} />
diff --git a/src/collections/components/CollectionImage/CollectionImage.tsx b/src/collections/components/CollectionImage/CollectionImage.tsx
index a4cb01d32..6e96904c6 100644
--- a/src/collections/components/CollectionImage/CollectionImage.tsx
+++ b/src/collections/components/CollectionImage/CollectionImage.tsx
@@ -92,6 +92,7 @@ export const CollectionImage: React.FC<CollectionImageProps> = props => {
               onChange={event => onImageUpload(event.target.files[0])}
               type="file"
               ref={anchor}
+              accept="image/*"
             />
           </>
         }
@@ -105,7 +106,7 @@ export const CollectionImage: React.FC<CollectionImageProps> = props => {
           </div>
         </CardContent>
       ) : image === null ? (
-        <ImageUpload onImageUpload={onImageUpload} />
+        <ImageUpload onImageUpload={files => onImageUpload(files[0])} />
       ) : (
         <CardContent>
           <ImageTile image={image} onImageDelete={onImageDelete} />