diff --git a/projects/common/element-components/button.component.ts b/projects/common/element-components/button.component.ts
index ca4c613c1727abad00fef81be2cbd6aea9a200a4..ec2be98c23c41f5462b628d8402fb7d81f498ace 100644
--- a/projects/common/element-components/button.component.ts
+++ b/projects/common/element-components/button.component.ts
@@ -5,7 +5,7 @@ import { ButtonElement } from '../unit';
 @Component({
   selector: 'app-button',
   template: `
-    <button mat-button
+    <button *ngIf="!elementModel.imageSrc" mat-button
             (focusin)="onFocusin.emit()"
             [style.width.%]="100"
             [style.height.%]="100"
@@ -18,6 +18,9 @@ import { ButtonElement } from '../unit';
             [style.text-decoration]="elementModel.underline ? 'underline' : ''">
       {{elementModel.label}}
     </button>
+    <input *ngIf="elementModel.imageSrc" type="image" [src]="elementModel.imageSrc"
+           [width]="elementModel.width" [height]="elementModel.height"
+           [style.object-fit]="'scale-down'" alt="Bild nicht gefunden">
   `
 })
 export class ButtonComponent extends ElementComponent {
diff --git a/projects/common/unit.ts b/projects/common/unit.ts
index a5e0ba0895467f10cc5cf0eeae7f58b510b77aff..65dbd735278a8d8f10c005d6c04eaa2dc7ca5916 100644
--- a/projects/common/unit.ts
+++ b/projects/common/unit.ts
@@ -83,6 +83,7 @@ export interface TextElement extends SurfaceUIElement {
 
 export interface ButtonElement extends TextUIElement, SurfaceUIElement {
   label: string;
+  imageSrc?: string;
   action: undefined | 'previous' | 'next' | 'end';
 }
 
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
index bc6db46b959769825302b802165cb35053f69e50..4f616d4ec2d017dd8312f845da8c2c1da3651193 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
+++ b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.html
@@ -25,6 +25,15 @@
           </div>
         </ng-container>
 
+        <div *ngIf="combinedProperties.type === 'button'">
+          <input #imageUpload type="file" hidden (click)="loadImage()">
+          <button mat-raised-button (click)="imageUpload.click()">Bild laden</button>
+          <button mat-raised-button (click)="removeImage()">Bild entfernen</button>
+          <img [src]="combinedProperties.imageSrc"
+               [style.object-fit]="'scale-down'"
+          [width]="200">
+        </div>
+
         <mat-form-field *ngIf="combinedProperties.appearance" appearance="fill">
           <mat-label>Aussehen</mat-label>
           <mat-select [value]="combinedProperties.appearance"
diff --git a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.ts b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.ts
index 0ff66221877434c168331ea9b3264ff1090432db..829ac3d3cd71bf62a0960c6a10379624bf46c469 100644
--- a/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/properties/element-properties.component.ts
@@ -127,4 +127,12 @@ export class ElementPropertiesComponent implements OnInit, OnDestroy {
     valueList.splice(valueList.indexOf(option), 1);
     this.updateModel(property, valueList);
   }
+
+  async loadImage(): Promise<void> {
+    this.updateModel('imageSrc', await FileService.loadImage());
+  }
+
+  removeImage(): void {
+    this.updateModel('imageSrc', undefined);
+  }
 }