diff --git a/itenium-socks/public/sock-images/Socks-placeholder.png b/itenium-socks/public/sock-images/Socks-placeholder.png
new file mode 100644
index 0000000..aa2a11c
Binary files /dev/null and b/itenium-socks/public/sock-images/Socks-placeholder.png differ
diff --git a/itenium-socks/src/app/socks/shop.component.html b/itenium-socks/src/app/socks/shop.component.html
index a0139e2..775ab7f 100644
--- a/itenium-socks/src/app/socks/shop.component.html
+++ b/itenium-socks/src/app/socks/shop.component.html
@@ -10,7 +10,8 @@ <h2>
         <div class="box">
           <a href="/socks/{{ sock.id }}">
             <div class="img-box">
-              <img src="sock-images/Socks-{{ sock.brand }}-{{ sock.variant }}.png" />
+              <img src="sock-images/Socks-{{ sock.brand }}-{{ sock.variant }}.png"
+                   (error)="handleImageError($event, 'sock-images/Socks-placeholder.png')"/>
             </div>
             <div class="detail-box">
               <h6>{{ sock.name }}</h6>
diff --git a/itenium-socks/src/app/socks/shop.component.ts b/itenium-socks/src/app/socks/shop.component.ts
index 33c897b..6fb06b4 100644
--- a/itenium-socks/src/app/socks/shop.component.ts
+++ b/itenium-socks/src/app/socks/shop.component.ts
@@ -18,4 +18,8 @@ export class ShopComponent {
   ngOnInit(): void {
     this.socks$ = this.socksService.get();
   }
+
+  handleImageError(event: any, placeholder: string) {
+    event.target.src = placeholder;
+  }
 }