diff --git a/src/app/Http/Livewire/CardForm.php b/src/app/Http/Livewire/CardForm.php
new file mode 100644
index 0000000..bbcc1ca
--- /dev/null
+++ b/src/app/Http/Livewire/CardForm.php
@@ -0,0 +1,85 @@
+<?php
+
+namespace App\Http\Livewire;
+
+use App\Models\Card;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+class CardForm extends Component
+{
+    use WithPagination;
+
+    public $name;
+    public $description;
+    public $type;
+    public $value;
+    public $meaning;
+    public $meaning_rev;
+    public $card_id;
+
+    protected $rules = [
+        'name' => 'required',
+        'description' => 'required',
+        'type' => 'required',
+        'value' => 'required',
+        'meaning' => 'required',
+        'meaning_rev' => 'required',
+    ];
+
+    public function storeCard()
+    {
+        $this->validate();
+        $card = Card::create([
+            'name' => $this->name,
+            'description' => $this->description,
+            'type' => $this->type,
+            'value' => $this->value,
+            'meaning' => $this->meaning,
+            'meaning_rev' => $this->meaning_rev
+        ]);
+        $this->reset();
+    }
+
+    public function edit($id)
+    {
+        $card = Card::find($id);
+        $this->card_id = $card->id;
+        $this->name = $card->name;
+        $this->description = $card->description;
+        $this->type = $card->type;
+        $this->value = $card->value;
+        $this->meaning = $card->meaning;
+        $this->meaning_rev = $card->meaning_rev;
+    }
+
+    public function update()
+    {
+        $card = Card::updateOrCreate(
+            [
+                'id'   => $this->card_id,
+            ],
+            [
+                'name' => $this->name,
+                'description' => $this->description,
+                'type' => $this->type,
+                'value' => $this->value,
+                'meaning' => $this->meaning,
+                'meaning_rev' => $this->meaning_rev
+            ],
+
+        );
+
+        $this->reset();
+    }
+
+    public function destroy($id)
+    {
+        Card::destroy($id);
+    }
+
+    public function render()
+    {
+        return view('livewire.card-form', ['cards' => Card::latest()->paginate(10)]);
+    }
+}
diff --git a/src/resources/views/cards.blade.php b/src/resources/views/cards.blade.php
new file mode 100644
index 0000000..6775b5f
--- /dev/null
+++ b/src/resources/views/cards.blade.php
@@ -0,0 +1,24 @@
+<x-layout>
+    <x-slot name="scripts">
+        <script>
+        </script>
+    </x-slot>
+    <x-slot name="title">Karten</x-slot>
+    <x-slot name="content">
+        <div class="container px-4 mx-auto">
+
+            <div class="py-12">
+                <div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
+                    <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
+                        <div class="p-6 bg-white border-b border-gray-200">
+                            <livewire:card-form />
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </div> <!-- Ende container -->
+    </x-slot>
+</x-layout>
+
+
diff --git a/src/resources/views/livewire/card-form.blade.php b/src/resources/views/livewire/card-form.blade.php
new file mode 100644
index 0000000..01ffdd9
--- /dev/null
+++ b/src/resources/views/livewire/card-form.blade.php
@@ -0,0 +1,125 @@
+<div>
+    <h4 class="mb-4 text-2xl font-bold">Card </h4>
+      <div>
+          <div class="container mx-auto">
+              <form method="POST" wire:submit.prevent="storeCard">
+                  @csrf
+                  <div>
+                      <label for="name">Name</label>
+                      <input type="text" wire:model.lazy="name" class="w-full py-2 rounded">
+                      @error('name')
+                      <span class="text-red-600">{{ $message }}</span>
+                      @enderror
+                  </div>
+                  <div class="mt-8">
+                      <label class="block mb-2 text-xl">Beschreibung </label>
+                      <textarea wire:model.lazy="description" rows="3" cols="20" class="w-full rounded">
+                      </textarea>
+                      @error('description')
+                      <span class="text-red-600">{{ $message }}</span>
+                      @enderror
+                  </div>
+                  <div class="mt-8">
+                    <label class="block mb-2 text-xl">Typ </label>
+                    <textarea wire:model.lazy="type" rows="3" cols="20" class="w-full rounded">
+                    </textarea>
+                    @error('type')
+                    <span class="text-red-600">{{ $message }}</span>
+                    @enderror
+                  </div>
+                  <div class="mt-8">
+                    <label class="block mb-2 text-xl">Karten-Wert </label>
+                    <textarea wire:model.lazy="value" rows="3" cols="20" class="w-full rounded">
+                    </textarea>
+                    @error('value')
+                    <span class="text-red-600">{{ $message }}</span>
+                    @enderror
+                  </div>
+                  <div class="mt-8">
+                    <label class="block mb-2 text-xl">Deutung </label>
+                    <textarea wire:model.lazy="meaning" rows="3" cols="20" class="w-full rounded">
+                    </textarea>
+                    @error('meaning')
+                    <span class="text-red-600">{{ $message }}</span>
+                    @enderror
+                  </div>
+                  <div class="mt-8">
+                    <label class="block mb-2 text-xl">Deutung Inverse</label>
+                    <textarea wire:model.lazy="meaning_rev" rows="3" cols="20" class="w-full rounded">
+                    </textarea>
+                    @error('meaning_rev')
+                    <span class="text-red-600">{{ $message }}</span>
+                    @enderror
+                  </div>
+                  <button type="submit" class="px-4 py-2 mt-4 text-white bg-blue-600 rounded">
+                      Submit
+                  </button>
+                  <button type="submit" wire:click="update" class="px-4 py-2 text-white bg-indigo-600 rounded">
+                      Update
+                  </button>
+              </form>
+          </div>
+          <div class="flex flex-col mt-8">
+              <div class="py-2">
+                  <div
+                      class="min-w-full border-b border-gray-200 shadow">
+                      <table class="min-w-full">
+                          <thead>
+                              <tr>
+                                  <th class="px-6 py-3 text-left text-gray-500 border-b border-gray-200 bg-gray-50">
+                                      Id
+                                  </th>
+                                  <th class="px-6 py-3 text-left text-gray-500 border-b border-gray-200 bg-gray-50">
+                                      Name
+                                  </th>
+                                  <th class="px-6 py-3 text-left text-gray-500 border-b border-gray-200 bg-gray-50">
+                                      Edit
+                                  </th>
+                                  <th class="px-6 py-3 text-left text-gray-500 border-b border-gray-200 bg-gray-50">
+                                      Delete
+                                  </th>
+                              </tr>
+                          </thead>
+
+                          <tbody class="bg-white">
+                              @foreach($cards as $card)
+                              <tr>
+                                  <td class="px-6 py-4 border-b border-gray-200">
+                                      <div class="flex items-center">
+                                          <div class="ml-4">
+                                              <div class="text-sm text-gray-900">
+                                                  {{ $card->id }}
+                                              </div>
+                                          </div>
+                                      </div>
+                                  </td>
+
+                                  <td class="px-6 py-4 border-b border-gray-200">
+                                      <div class="text-sm text-gray-900">
+                                          {{ $card->name }}
+                                      </div>
+                                  </td>
+
+                                  <td class="px-6 py-4 border-b border-gray-200">
+                                      <button wire:click="edit({{ $card->id }})" class="px-4 py-2 text-white bg-blue-600">
+                                          Edit
+                                      </button>
+                                  </td>
+
+                                  <td class="px-6 py-4 text-sm text-gray-500 border-b border-gray-200">
+                                      <button wire:click="destroy({{ $card->id }})"
+                                          class="px-4 py-2 text-white bg-red-600">
+                                          Delete
+                                      </button>
+                                  </td>
+
+                              </tr>
+                              @endforeach
+                          </tbody>
+                      </table>
+                  </div>
+                  {{ $cards->links() }}
+              </div>
+          </div>
+      </div>
+  </div>