diff --git a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.css b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.css
index ac54d29..e69de29 100644
--- a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.css
+++ b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.css
@@ -1,120 +0,0 @@
-body {
-  font-family: sans-serif;
-  margin: 0;
-  padding: 20px;
-  background-color: #f0f0f0;
-}
-
-.container {
-  width: 100%;
-  max-width: 800px;
-  margin: 0 auto;
-  padding: 20px;
-  background-color: #fff;
-}
-
-h1, h2 {
-  font-size: 2rem;
-  margin-bottom: 20px;
-}
-
-.back-button {
-  background-color: #ccc;
-  color: #333;
-  border: none;
-  padding: 8px 12px;
-  border-radius: 3px;
-  margin-bottom: 15px;
-}
-
-.user-info {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-gap: 20px;
-  margin-bottom: 20px;
-}
-
-.form-group {
-  display: flex;
-  flex-direction: column;
-}
-
-label {
-  margin-bottom: 5px;
-}
-
-input[type="text"] {
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 3px;
-}
-
-input[type="text"]::placeholder {
-  color: #999;
-}
-
-.save-button {
-  background-color: #007bff;
-  color: #fff;
-  padding: 10px 15px;
-  border: none;
-  border-radius: 3px;
-  cursor: pointer;
-  margin-top: 10px;
-  width: 100%;
-}
-
-.skills-container {
-  border: 1px solid #ccc;
-  padding: 20px;
-  border-radius: 3px;
-}
-
-.skill-controls select {
-  padding: 10px 10px;
-  border: none;
-  border-radius: 3px;
-  background-color: #007bff;
-  color: #fff;
-  cursor: pointer;
-}
-
-.skill-list {
-  list-style: none;
-  padding: 0;
-}
-
-.skill-list li {
-  display: flex;
-  align-items: center;
-  margin-bottom: 5px;
-}
-
-.skill-icon {
-  margin-right: 5px;
-}
-
-.delete-skill-button {
-  color: #fff;
-  padding: 5px 8px;
-  border: none;
-  cursor: pointer;
-  margin-left: 10px;
-  border-radius: 3px;
-}
-
-.delete-skill-button img {
-  width: 15px;
-  height: 15px;
-}
-
-.add-skill-button{
-  background-color: #06a63b;
-  color: #fff;
-  padding: 8px 10px;
-  border: none;
-  border-radius: 3px;
-  cursor: pointer;
-  margin-left: 10px;
-}
-
diff --git a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.html b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.html
index 4bc03b5..fccd9f7 100644
--- a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.html
+++ b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.html
@@ -1,49 +1 @@
-<div class="container">
-  <button class="back-button">Back</button>
-  <div class="user-info">
-    <div class="form-group">
-      <label for="firstName">First Name</label>
-      <input type="text" id="firstName" placeholder="First Name">
-    </div>
-    <div class="form-group">
-      <label for="lastName">Last Name</label>
-      <input type="text" id="lastName" placeholder="Last Name">
-    </div>
-    <div class="form-group">
-      <label for="street">Street</label>
-      <input type="text" id="street" placeholder="Street">
-    </div>
-    <div class="form-group">
-      <label for="postcode">Postcode</label>
-      <input type="text" id="postcode" placeholder="Postcode">
-    </div>
-    <div class="form-group">
-      <label for="city">City</label>
-      <input type="text" id="city" placeholder="City">
-    </div>
-    <div class="form-group">
-      <label for="phone">Phone Number</label>
-      <input type="text" id="phone" placeholder="Phone Number">
-    </div>
-  </div>
-
-  <div class="skills-container">
-    <h2>Skills</h2>
-    <ul class="skill-list">
-      <li>
-        <span class="skill-name">Skill 1</span>
-          <button class="delete-skill-button">
-            <img src="Delete-button.svg" alt="Delete">
-          </button>
-      </li>
-    </ul>
-    <div class="skill-controls">
-      <select>
-        <option value="">Option 1</option>
-        <option value="">Option 2</option>
-      </select>
-      <button class="add-skill-button">Add qualification</button>
-    </div>
-  </div>
-  <button class="save-button">Save</button>
-</div>
+<app-mitarbeiter-form></app-mitarbeiter-form>
diff --git a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.ts b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.ts
index ccf171e..2f3c3c5 100644
--- a/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.ts
+++ b/src/app/components/mitarbeiter-bearbeiten-view/mitarbeiter-bearbeiten-view.component.ts
@@ -1,9 +1,10 @@
 import { Component } from '@angular/core';
+import { MitarbeiterFormComponent } from '../mitarbeiter-form/mitarbeiter-form.component';
 
 @Component({
   selector: 'app-mitarbeiter-bearbeiten-view',
   standalone: true,
-  imports: [],
+  imports: [MitarbeiterFormComponent],
   templateUrl: './mitarbeiter-bearbeiten-view.component.html',
   styleUrl: './mitarbeiter-bearbeiten-view.component.css'
 })
diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.css b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.css
new file mode 100644
index 0000000..ac54d29
--- /dev/null
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.css
@@ -0,0 +1,120 @@
+body {
+  font-family: sans-serif;
+  margin: 0;
+  padding: 20px;
+  background-color: #f0f0f0;
+}
+
+.container {
+  width: 100%;
+  max-width: 800px;
+  margin: 0 auto;
+  padding: 20px;
+  background-color: #fff;
+}
+
+h1, h2 {
+  font-size: 2rem;
+  margin-bottom: 20px;
+}
+
+.back-button {
+  background-color: #ccc;
+  color: #333;
+  border: none;
+  padding: 8px 12px;
+  border-radius: 3px;
+  margin-bottom: 15px;
+}
+
+.user-info {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-gap: 20px;
+  margin-bottom: 20px;
+}
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+}
+
+label {
+  margin-bottom: 5px;
+}
+
+input[type="text"] {
+  padding: 10px;
+  border: 1px solid #ddd;
+  border-radius: 3px;
+}
+
+input[type="text"]::placeholder {
+  color: #999;
+}
+
+.save-button {
+  background-color: #007bff;
+  color: #fff;
+  padding: 10px 15px;
+  border: none;
+  border-radius: 3px;
+  cursor: pointer;
+  margin-top: 10px;
+  width: 100%;
+}
+
+.skills-container {
+  border: 1px solid #ccc;
+  padding: 20px;
+  border-radius: 3px;
+}
+
+.skill-controls select {
+  padding: 10px 10px;
+  border: none;
+  border-radius: 3px;
+  background-color: #007bff;
+  color: #fff;
+  cursor: pointer;
+}
+
+.skill-list {
+  list-style: none;
+  padding: 0;
+}
+
+.skill-list li {
+  display: flex;
+  align-items: center;
+  margin-bottom: 5px;
+}
+
+.skill-icon {
+  margin-right: 5px;
+}
+
+.delete-skill-button {
+  color: #fff;
+  padding: 5px 8px;
+  border: none;
+  cursor: pointer;
+  margin-left: 10px;
+  border-radius: 3px;
+}
+
+.delete-skill-button img {
+  width: 15px;
+  height: 15px;
+}
+
+.add-skill-button{
+  background-color: #06a63b;
+  color: #fff;
+  padding: 8px 10px;
+  border: none;
+  border-radius: 3px;
+  cursor: pointer;
+  margin-left: 10px;
+}
+
diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html
new file mode 100644
index 0000000..4bc03b5
--- /dev/null
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.html
@@ -0,0 +1,49 @@
+<div class="container">
+  <button class="back-button">Back</button>
+  <div class="user-info">
+    <div class="form-group">
+      <label for="firstName">First Name</label>
+      <input type="text" id="firstName" placeholder="First Name">
+    </div>
+    <div class="form-group">
+      <label for="lastName">Last Name</label>
+      <input type="text" id="lastName" placeholder="Last Name">
+    </div>
+    <div class="form-group">
+      <label for="street">Street</label>
+      <input type="text" id="street" placeholder="Street">
+    </div>
+    <div class="form-group">
+      <label for="postcode">Postcode</label>
+      <input type="text" id="postcode" placeholder="Postcode">
+    </div>
+    <div class="form-group">
+      <label for="city">City</label>
+      <input type="text" id="city" placeholder="City">
+    </div>
+    <div class="form-group">
+      <label for="phone">Phone Number</label>
+      <input type="text" id="phone" placeholder="Phone Number">
+    </div>
+  </div>
+
+  <div class="skills-container">
+    <h2>Skills</h2>
+    <ul class="skill-list">
+      <li>
+        <span class="skill-name">Skill 1</span>
+          <button class="delete-skill-button">
+            <img src="Delete-button.svg" alt="Delete">
+          </button>
+      </li>
+    </ul>
+    <div class="skill-controls">
+      <select>
+        <option value="">Option 1</option>
+        <option value="">Option 2</option>
+      </select>
+      <button class="add-skill-button">Add qualification</button>
+    </div>
+  </div>
+  <button class="save-button">Save</button>
+</div>
diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.spec.ts b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.spec.ts
new file mode 100644
index 0000000..76b7600
--- /dev/null
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MitarbeiterFormComponent } from './mitarbeiter-form.component';
+
+describe('MitarbeiterFormComponent', () => {
+  let component: MitarbeiterFormComponent;
+  let fixture: ComponentFixture<MitarbeiterFormComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [MitarbeiterFormComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(MitarbeiterFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
new file mode 100644
index 0000000..59b5c0f
--- /dev/null
+++ b/src/app/components/mitarbeiter-form/mitarbeiter-form.component.ts
@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-mitarbeiter-form',
+  standalone: true,
+  imports: [MitarbeiterFormComponent],
+  templateUrl: './mitarbeiter-form.component.html',
+  styleUrl: './mitarbeiter-form.component.css'
+})
+export class MitarbeiterFormComponent {
+
+}