diff --git a/goofy-client/apps/goofy/src/styles/main.scss b/goofy-client/apps/goofy/src/styles/main.scss
index 7f0e1954f36942047bfd236a9a369817ce1c3909..d8ddf0d508ef43f5689497a99d46ec870124a853 100644
--- a/goofy-client/apps/goofy/src/styles/main.scss
+++ b/goofy-client/apps/goofy/src/styles/main.scss
@@ -20,6 +20,7 @@
 @import "~libs/user-profile/src/lib/user-profile-in-vorgang-container/user-profile-in-vorgang/user-profile-in-vorgang.theme";
 @import "~libs/user-profile/src/lib/user-profile-search-container/user-profile-search-container.theme";
 @import "~libs/vorgang-shared-ui/src/lib/vorgang-nummer/vorgang-nummer.component.theme";
+@import "~libs/ui/src/lib/ui/postfach-status/postfach-status.component.theme";
 
 @include mat.core();
 
diff --git a/goofy-client/libs/ui/src/index.ts b/goofy-client/libs/ui/src/index.ts
index bd76d70b402922f7ed3cd363d71184a6b93ed619..74eb1036a3d0a5db1c1463870dd3af0177e67565 100644
--- a/goofy-client/libs/ui/src/index.ts
+++ b/goofy-client/libs/ui/src/index.ts
@@ -12,6 +12,7 @@ export * from './lib/ui/file-upload/file-upload.component';
 export * from './lib/ui/fixed-dialog/fixed-dialog-data.model';
 export * from './lib/ui/fixed-dialog/fixed-dialog.component';
 export * from './lib/ui/icon-button-with-spinner/icon-button-with-spinner.component';
+export * from './lib/ui/postfach-status/postfach-status.component';
 export * from './lib/ui/spinner/spinner.component';
 export * from './lib/ui/subnavigation/subnavigation.component';
 export * from './lib/ui/ui.module';
diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss b/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss
new file mode 100644
index 0000000000000000000000000000000000000000..5683c0a05d9add430153c01e3a56d643d210f58f
--- /dev/null
+++ b/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss
@@ -0,0 +1,10 @@
+goofy-client-postfach-status {
+	.mat-badge-small.mat-badge-above .mat-badge-content {
+		top: -3px;
+	}
+	.mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
+		width: 12px;
+		height: 12px;
+		right: -4px;
+	}
+}
diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..fb5b07c981d3a4b6603f7c3650b65ea63c08f4ed
--- /dev/null
+++ b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html
@@ -0,0 +1,7 @@
+<mat-icon data-test-class="postfach-status"
+	svgIcon="mail"
+	matBadge="&NoBreak;"
+	[matBadgeHidden]="!showBadge"
+	matBadgeSize="small"
+	matBadgeDescription="Neue Postfachnachrichten">
+</mat-icon>
\ No newline at end of file
diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.scss b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.scss
similarity index 100%
rename from goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.scss
rename to goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.scss
diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts
similarity index 57%
rename from goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts
rename to goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts
index 02635cfeada795d467a954afd56836416bd98586..18e5ea00a1e8723e73e66c02d541054a542e6f01 100644
--- a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts
+++ b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts
@@ -1,36 +1,35 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatBadge, MatBadgeModule } from '@angular/material/badge';
 import { MatIcon } from '@angular/material/icon';
 import { MatIconTestingModule } from '@angular/material/icon/testing';
 import { getElementFromFixture } from '@goofy-client/test-utils';
-import { VorgangResource } from '@goofy-client/vorgang-shared';
 import { getDataTestClassOf } from 'libs/tech-shared/test/data-test';
-import { createVorgangResource } from 'libs/vorgang-shared/test/vorgang';
-import { VorgangPostfachStatusComponent } from './vorgang-postfach-status.component';
+import { PostfachStatusComponent } from './postfach-status.component';
 
 
-describe('VorgangPostfachStatusComponent', () => {
-	let component: VorgangPostfachStatusComponent;
-	let fixture: ComponentFixture<VorgangPostfachStatusComponent>;
+describe('PostfachStatusComponent', () => {
+	let component: PostfachStatusComponent;
+	let fixture: ComponentFixture<PostfachStatusComponent>;
 
-	const vorgang: VorgangResource = createVorgangResource();
 	const postfachStatus: string = getDataTestClassOf('postfach-status');
 
 	beforeEach(async () => {
 		await TestBed.configureTestingModule({
 			declarations: [
 				MatIcon,
-				VorgangPostfachStatusComponent
+				PostfachStatusComponent,
+				MatBadge,
 			],
 			imports: [
 				MatIconTestingModule,
+				MatBadgeModule,
 			],
 		}).compileComponents();
 	});
 
 	beforeEach(() => {
-		fixture = TestBed.createComponent(VorgangPostfachStatusComponent);
+		fixture = TestBed.createComponent(PostfachStatusComponent);
 		component = fixture.componentInstance;
-		component.vorgang = vorgang;
 		fixture.detectChanges();
 	});
 
@@ -40,21 +39,19 @@ describe('VorgangPostfachStatusComponent', () => {
 
 	describe('mail icon', () => {
 		it('should show mail icon', () => {
-			component.vorgang.hasPostfachNachricht = true;
-			fixture.detectChanges();
-
 			const icon: HTMLElement = getElementFromFixture(fixture, postfachStatus);
 
     		expect(icon).toHaveClass('mat-icon');
+			expect(icon).toHaveClass('mat-badge-hidden');
 		});
 
-		it('should not show mail icon', () => {
-			component.vorgang.hasPostfachNachricht = false;
+		it('should show mail icon with badge', () => {
+			component.showBadge = true;
 			fixture.detectChanges();
 
 			const icon: HTMLElement = getElementFromFixture(fixture, postfachStatus);
 
-    		expect(icon).toBeNull();
+			expect(icon).toHaveClass('mat-badge');
 		});
 	});
 });
diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..e852391a2cc2d105f80e0d80ac5ddc0cff6e8794
--- /dev/null
+++ b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts
@@ -0,0 +1,12 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+	selector: 'goofy-client-postfach-status',
+	templateUrl: './postfach-status.component.html',
+	styleUrls: ['./postfach-status.component.scss'],
+})
+export class PostfachStatusComponent {
+
+	@Input() showBadge: boolean = false;
+
+}
diff --git a/goofy-client/libs/ui/src/lib/ui/ui.module.ts b/goofy-client/libs/ui/src/lib/ui/ui.module.ts
index c482f7fc5c5248928f8c0ac3a5b03f48d66ed7fe..2b491a749e5909254273ea532069ffd7a20fd28d 100644
--- a/goofy-client/libs/ui/src/lib/ui/ui.module.ts
+++ b/goofy-client/libs/ui/src/lib/ui/ui.module.ts
@@ -4,6 +4,7 @@ import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { DateFnsAdapter, MatDateFnsModule } from '@angular/material-date-fns-adapter';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatBadgeModule } from '@angular/material/badge';
 import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { DateAdapter, MatRippleModule, MAT_DATE_LOCALE } from '@angular/material/core';
@@ -42,6 +43,7 @@ import { ConnectionTimeoutRetryFailDialogComponent } from './http-error-dialog/c
 import { IconButtonWithSpinnerComponent } from './icon-button-with-spinner/icon-button-with-spinner.component';
 import { MattooltipClassDirective, MattooltipDirective, MattooltipDisabledDirective } from './mattooltip/mattooltip.directive';
 import { InternalServerErrorDialogComponent } from './notification/internal-server-error-dialog/internal-server-error-dialog.component';
+import { PostfachStatusComponent } from './postfach-status/postfach-status.component';
 import { ProgressBarComponent } from './progress-bar/progress-bar.component';
 import { SpinnerComponent } from './spinner/spinner.component';
 import { SubnavigationComponent } from './subnavigation/subnavigation.component';
@@ -69,7 +71,8 @@ const components = [
 	FileUploadEditorComponent,
 	MattooltipDirective,
 	MattooltipDisabledDirective,
-	MattooltipClassDirective
+	MattooltipClassDirective,
+	PostfachStatusComponent
 ];
 
 const modules = [
@@ -93,6 +96,7 @@ const modules = [
 	MatAutocompleteModule,
 	MatDialogModule,
 	MatTabsModule,
+	MatBadgeModule,
 	CommonModule,
 	TechSharedModule
 ];
diff --git a/goofy-client/libs/vorgang-shared-ui/src/index.ts b/goofy-client/libs/vorgang-shared-ui/src/index.ts
index af2fd02f43797a7441a8a4a24e2941286b860349..d151c0ad220a42a5f018ccc31baaa506fd4a48c5 100644
--- a/goofy-client/libs/vorgang-shared-ui/src/index.ts
+++ b/goofy-client/libs/vorgang-shared-ui/src/index.ts
@@ -1,7 +1,6 @@
 export * from './lib/aktenzeichen/aktenzeichen.component';
 export * from './lib/vorgang-in-postfach-breadcrumb-container/vorgang-in-postfach-breadcrumb-container.component';
 export * from './lib/vorgang-nummer/vorgang-nummer.component';
-export * from './lib/vorgang-postfach-status/vorgang-postfach-status.component';
 export * from './lib/vorgang-search-container/vorgang-search-container.component';
 export * from './lib/vorgang-shared-ui.module';
 export * from './lib/vorgang-status-dot/vorgang-status-dot.component';
diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html
deleted file mode 100644
index 5d88b6c0d9d07abd69c2ea863e1c90c6bb15ee85..0000000000000000000000000000000000000000
--- a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<mat-icon *ngIf="vorgang.hasPostfachNachricht === true" data-test-class="postfach-status"
-	svgIcon="mail">
-</mat-icon>
\ No newline at end of file
diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts
deleted file mode 100644
index 012bb0a3d13c2d7db58e31e5143644b4bb50591a..0000000000000000000000000000000000000000
--- a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Component, Input } from '@angular/core';
-import { Vorgang } from '@goofy-client/vorgang-shared';
-
-@Component({
-	selector: 'goofy-client-vorgang-postfach-status',
-	templateUrl: './vorgang-postfach-status.component.html',
-	styleUrls: ['./vorgang-postfach-status.component.scss'],
-})
-export class VorgangPostfachStatusComponent {
-
-	@Input() vorgang: Vorgang;
-
-}
diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts
index e0e957351d94cc0d9a45d68134e4d358da5e4245..cc32dc47b59ffa44b249b317f177cb5f559239ce 100644
--- a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts
+++ b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts
@@ -14,7 +14,6 @@ import { VorgangSearchClearButtonComponent } from './vorgang-search-container/vo
 import { VorgangSearchComponent } from './vorgang-search-container/vorgang-search/vorgang-search.component';
 import { VorgangStatusDotComponent } from './vorgang-status-dot/vorgang-status-dot.component';
 import { VorgangStatusTextComponent } from './vorgang-status-text/vorgang-status-text.component';
-import { VorgangPostfachStatusComponent } from './vorgang-postfach-status/vorgang-postfach-status.component';
 
 @NgModule({
 	imports: [
@@ -35,7 +34,6 @@ import { VorgangPostfachStatusComponent } from './vorgang-postfach-status/vorgan
 		VorgangSearchClearButtonComponent,
 		VorgangNummerComponent,
 		VorgangStatusTextComponent,
-		VorgangPostfachStatusComponent,
 	],
 	exports: [
 		VorgangSearchContainerComponent,
@@ -45,7 +43,6 @@ import { VorgangPostfachStatusComponent } from './vorgang-postfach-status/vorgan
 		VorgangSearchAutocompleteOptionsContentComponent,
 		VorgangNummerComponent,
 		VorgangStatusTextComponent,
-		VorgangPostfachStatusComponent,
 	],
 })
 export class VorgangSharedUiModule {}
diff --git a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html
index 36c4396861b501bd5799f551fc82ed18110214be..7e791004d8b00dfdcc478a8fd3337dfa260c6f11 100644
--- a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html
+++ b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html
@@ -10,7 +10,11 @@
 			class="status-text"></goofy-client-vorgang-status-text>
 	</div>
 
-	<goofy-client-vorgang-postfach-status class="postfach-status" [vorgang]="vorgang"></goofy-client-vorgang-postfach-status>
+	<goofy-client-postfach-status data-test-class="postfach-status"
+		*ngIf="vorgang.hasPostfachNachricht === true"
+		[showBadge]="vorgang.hasNewPostfachNachricht"
+		class="postfach-status">
+	</goofy-client-postfach-status>
 
 	<div class="aktenzeichen">
 		<mat-icon svgIcon="az"></mat-icon>
diff --git a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts
index 2140033efe67d131e597170a758e63a390428ebf..c524584c3ea70a60bf9ba5d092968a3538cf7d92 100644
--- a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts
+++ b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts
@@ -9,11 +9,13 @@ import { MatIconTestingModule } from '@angular/material/icon/testing';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { RouterTestingModule } from '@angular/router/testing';
 import { convertForDataTest, ConvertForDataTestPipe, EnumToLabelPipe, FormatDateWithTimePipe, FormatToPrettyDatePipe, HasLinkPipe, ToResourceUriPipe } from '@goofy-client/tech-shared';
+import { getElementFromFixture } from '@goofy-client/test-utils';
+import { PostfachStatusComponent } from '@goofy-client/ui';
 import { UserProfileInVorgangListItemContainerComponent } from '@goofy-client/user-profile';
 import { VorgangHeaderLinkRel } from '@goofy-client/vorgang-shared';
-import { AktenzeichenComponent, VorgangNummerComponent, VorgangPostfachStatusComponent, VorgangStatusDotComponent, VorgangStatusTextComponent } from '@goofy-client/vorgang-shared-ui';
+import { AktenzeichenComponent, VorgangNummerComponent, VorgangStatusDotComponent, VorgangStatusTextComponent } from '@goofy-client/vorgang-shared-ui';
 import { WiedervorlageListInVorgangListContainerComponent } from '@goofy-client/wiedervorlage';
-import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
+import { getDataTestClassOf, getDataTestIdOf } from 'libs/tech-shared/test/data-test';
 import { createVorgangResource } from 'libs/vorgang-shared/test/vorgang';
 import { MockComponent } from 'ng-mocks';
 import { VorgangListItemComponent } from './vorgang-list-item.component';
@@ -25,7 +27,8 @@ describe('VorgangListItemComponent', () => {
 	let component: VorgangListItemComponent;
 	let fixture: ComponentFixture<VorgangListItemComponent>;
 
-	const user: string = '[data-test-id="vorgang-user-icon"]';
+	const user: string = getDataTestIdOf('vorgang-user-icon');
+	const postfachStatus: string = getDataTestClassOf('postfach-status');
 
 	beforeEach(async () => {
 		await TestBed.configureTestingModule({
@@ -45,7 +48,7 @@ describe('VorgangListItemComponent', () => {
 				ConvertForDataTestPipe,
 				MockComponent(AktenzeichenComponent),
 				MockComponent(VorgangNummerComponent),
-				MockComponent(VorgangPostfachStatusComponent),
+				MockComponent(PostfachStatusComponent),
 				MockComponent(VorgangStatusDotComponent),
 				MockComponent(VorgangStatusTextComponent),
 				MockComponent(WiedervorlageListInVorgangListContainerComponent),
@@ -129,4 +132,32 @@ describe('VorgangListItemComponent', () => {
 		})
 
 	})
+
+	describe('mail icon', () => {
+		beforeEach(() => {
+			component.vorgang = createVorgangResource([VorgangHeaderLinkRel.VORGANG_WITH_EINGANG, VorgangHeaderLinkRel.POSTFACH_MAILS]);
+		})
+
+		it('should show mail icon if Vorgang has new Postfachnachricht', () => {
+			component.vorgang.hasPostfachNachricht = true;
+			fixture.detectChanges();
+
+			const listItem: string = getDataTestIdOf(`vorgang-list-item-${convertForDataTest(component.vorgang.name)}`);
+			const element: HTMLDivElement = fixture.nativeElement.querySelector(listItem);
+			const statusElement = getElementFromFixture(fixture, postfachStatus);
+
+			expect(element).toContainElement(statusElement);
+		})
+
+		it('should not show mail icon if Vorgang has no new Postfachnachricht', () => {
+			component.vorgang.hasPostfachNachricht = false;
+			fixture.detectChanges();
+
+			const listItem: string = getDataTestIdOf(`vorgang-list-item-${convertForDataTest(component.vorgang.name)}`);
+			const element: HTMLDivElement = fixture.nativeElement.querySelector(listItem);
+			const statusElement = getElementFromFixture(fixture, postfachStatus);
+
+			expect(element).not.toContainElement(statusElement);
+		})
+	})
 });
diff --git a/goofy-client/libs/vorgang/src/test-setup.ts b/goofy-client/libs/vorgang/src/test-setup.ts
index 08ef82b5d5efa87cb27257314075f6a16eb7a63e..82178098b34faeb3a94a8268bd072d4db95371a3 100644
--- a/goofy-client/libs/vorgang/src/test-setup.ts
+++ b/goofy-client/libs/vorgang/src/test-setup.ts
@@ -1,9 +1,10 @@
+import '@testing-library/jest-dom';
 import 'jest-preset-angular/setup-jest';
 
 import { getTestBed } from '@angular/core/testing';
 import {
 	BrowserDynamicTestingModule,
-	platformBrowserDynamicTesting,
+	platformBrowserDynamicTesting
 } from '@angular/platform-browser-dynamic/testing';
 
 getTestBed().resetTestEnvironment();