diff --git a/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/card-settings.model.ts b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/card-settings.model.ts
new file mode 100644
index 0000000..b18bf55
--- /dev/null
+++ b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/card-settings.model.ts
@@ -0,0 +1,11 @@
+export interface ICardSettings {
+  previewWidth: number;
+  previewHeight: number;
+  fallbackImage: string;
+}
+
+export class CardSettings implements ICardSettings {
+  static DEFAULT: CardSettings = new CardSettings(96, 96, '/content/images/jhipster_family_member_1.svg');
+
+  constructor(public previewWidth: number, public previewHeight: number, public fallbackImage: string) {}
+}
diff --git a/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.html b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.html
index 48dee02..88a76fd 100644
--- a/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.html
+++ b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.html
@@ -6,8 +6,8 @@ <h3 class="h3 d-inline-block">{{microservice.name}}</h3>
     <div class="card-body">
         <div class="d-flex flex-row mb-3">
 
-            <img [src]="microservice.imageUrl"
-                 (error)="microservice.imageUrl = '../../../../content/images/jhipster_family_member_1.svg'"
+            <img [src]="microservice.imageUrl" [width]="settings.previewWidth" [height]="settings.previewHeight"
+                 (error)="microservice.imageUrl = settings.fallbackImage"
                  alt="IMAGE"/>
             <div class="d-flex flex-column ml-2">
                 <span class="font-weight-bold">Team: {{microservice.team?.name}}</span>
diff --git a/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.ts b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.ts
index ab0723b..ce88d51 100644
--- a/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.ts
+++ b/src/main/webapp/app/entities/microservice/microservice-dashboard/microservice-card/microservice-card.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { IMicroservice } from 'app/shared/model/microservice.model';
+import { CardSettings, ICardSettings } from 'app/entities/microservice/microservice-dashboard/microservice-card/card-settings.model';
 
 @Component({
   selector: 'jhi-microservice-card',
@@ -8,8 +9,17 @@ import { IMicroservice } from 'app/shared/model/microservice.model';
 })
 export class MicroserviceCardComponent implements OnInit {
   @Input() microservice!: IMicroservice;
+  @Input() settings: ICardSettings = CardSettings.DEFAULT;
 
   constructor() {}
 
-  ngOnInit(): void {}
+  ngOnInit(): void {
+    this.assertInputsProvided();
+  }
+
+  private assertInputsProvided(): void {
+    if (!this.microservice || !this.settings) {
+      throw new Error('The required inputs [microservice] or [cardSettings] are not provided');
+    }
+  }
 }