diff --git a/src/assets/images/empty-album-dark.png b/src/assets/images/empty-album-dark.png
new file mode 100644
index 0000000..1b47c93
Binary files /dev/null and b/src/assets/images/empty-album-dark.png differ
diff --git a/src/assets/images/empty-album-light.png b/src/assets/images/empty-album-light.png
new file mode 100644
index 0000000..4971b69
Binary files /dev/null and b/src/assets/images/empty-album-light.png differ
diff --git a/src/components/CoverImage.tsx b/src/components/CoverImage.tsx
index f6aa003..b592708 100644
--- a/src/components/CoverImage.tsx
+++ b/src/components/CoverImage.tsx
@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import { Dimensions, ViewProps } from 'react-native';
+import { Dimensions, useColorScheme, ViewProps } from 'react-native';
 import { Canvas, Blur, Image as SkiaImage, useImage, Offset, Mask, RoundedRect, Shadow } from '@shopify/react-native-skia';
 import useDefaultStyles from './Colors';
 import styled from 'styled-components/native';
@@ -45,8 +45,10 @@ function CoverImage({
     src, 
 }: Props) {
     const defaultStyles = useDefaultStyles();
+    const colorScheme = useColorScheme();
 
-    const image = useImage(src || '');
+    const image = useImage(src || null);
+    const fallback = useImage(colorScheme === 'light' ? require('assets/images/empty-album-light.png') : require('assets/images/empty-album-dark.png'));
     const { canvasSize, imageSize } = useMemo(() => {
         const imageSize = Screen.width - margin;
         const canvasSize = imageSize + blurRadius * 2;
@@ -63,15 +65,15 @@ function CoverImage({
                     <Shadow dx={0} dy={8} blur={16} color="#0000000d" />
                     <Shadow dx={0} dy={16} blur={32} color="#0000000d" />
                 </RoundedRect>
-                {image ? (
+                {(image || fallback) ? (
                     <>
-                        <SkiaImage image={image} width={imageSize} height={imageSize} opacity={opacity}>
+                        <SkiaImage image={image || fallback} width={imageSize} height={imageSize} opacity={opacity}>
                             <Offset x={blurRadius} y={blurRadius} />
                             <Blur blur={blurRadius / 2} />
                         </SkiaImage>
                         <Mask mask={<RoundedRect width={imageSize} height={imageSize} x={blurRadius} y={blurRadius} r={radius}  />}>
-                            {image ? (
-                                <SkiaImage image={image} width={imageSize} height={imageSize}>
+                            {(image || fallback) ? (
+                                <SkiaImage image={image || fallback} width={imageSize} height={imageSize}>
                                     <Offset x={blurRadius} y={blurRadius} />
                                 </SkiaImage>
                             ) : null}
diff --git a/src/screens/Music/stacks/components/AlbumImage.ts b/src/screens/Music/stacks/components/AlbumImage.ts
deleted file mode 100644
index bc823d2..0000000
--- a/src/screens/Music/stacks/components/AlbumImage.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import styled from 'styled-components/native';
-import FastImage from 'react-native-fast-image';
-import { Dimensions } from 'react-native';
-
-const Screen = Dimensions.get('screen');
-export const AlbumWidth = Screen.width / 2 - 24;
-export const AlbumHeight = AlbumWidth + 40;
-export const CoverSize = AlbumWidth - 16;
-
-export const AlbumItem = styled.View`
-    width: ${AlbumWidth}px;
-    height: ${AlbumHeight}px;
-    padding: 8px;
-`;
-
-const AlbumImage = styled(FastImage)`
-    border-radius: 10px;
-    width: ${CoverSize}px;
-    height: ${CoverSize}px;
-    margin-bottom: 5px;
-`;
-
-export default AlbumImage;
\ No newline at end of file
diff --git a/src/screens/Music/stacks/components/AlbumImage.tsx b/src/screens/Music/stacks/components/AlbumImage.tsx
new file mode 100644
index 0000000..5a6bc70
--- /dev/null
+++ b/src/screens/Music/stacks/components/AlbumImage.tsx
@@ -0,0 +1,39 @@
+import React, { useState } from 'react';
+import styled from 'styled-components/native';
+import FastImage, { FastImageProps } from 'react-native-fast-image';
+import { Dimensions, Image, useColorScheme } from 'react-native';
+
+const Screen = Dimensions.get('screen');
+export const AlbumWidth = Screen.width / 2 - 24;
+export const AlbumHeight = AlbumWidth + 40;
+export const CoverSize = AlbumWidth - 16;
+
+export const AlbumItem = styled.View`
+    width: ${AlbumWidth}px;
+    height: ${AlbumHeight}px;
+    padding: 8px;
+`;
+
+const Container = styled(FastImage)`
+    border-radius: 10px;
+    width: ${CoverSize}px;
+    height: ${CoverSize}px;
+    margin-bottom: 5px;
+`;
+
+function AlbumImage(props: FastImageProps) {
+    const [hasError, setError] = useState(false);
+    const colorScheme = useColorScheme();
+
+    if (!props.source || hasError) {
+        return (
+            <Container source={colorScheme === 'light' ? require('assets/images/empty-album-light.png') : require('assets/images/empty-album-dark.png')} />
+        );
+    }
+
+    return (
+        <Container {...props} onError={() => setError(true)} />
+    );
+}
+
+export default AlbumImage;
\ No newline at end of file