diff --git a/resources/views/components/notifications/toast-wrapper.blade.php b/resources/views/components/notifications/toast-wrapper.blade.php
new file mode 100644
index 0000000..4042cf0
--- /dev/null
+++ b/resources/views/components/notifications/toast-wrapper.blade.php
@@ -0,0 +1,17 @@
+@props([
+
+    'timeout' => 5000,
+    'id' => uniqid('toast-'),
+    'position' => 'toast-top toast-center',
+])
+
+<div
+        x-data="{ show: true }"
+        x-init="setTimeout(() => show = false, {{ $timeout }})"
+        x-show="show"
+        x-transition
+        id="{{ $id }}"
+        class="toast {{ $position }} z-50"
+>
+    {{ $slot }}
+</div>
\ No newline at end of file
diff --git a/resources/views/components/notifications/toast.blade.php b/resources/views/components/notifications/toast.blade.php
new file mode 100644
index 0000000..b50c96e
--- /dev/null
+++ b/resources/views/components/notifications/toast.blade.php
@@ -0,0 +1,15 @@
+@props([
+    'type' => 'info',
+    'title' => null,
+    'message' => null,
+])
+
+<div class="alert alert-{{ $type }} shadow-lg" x-data="{ show: true }" x-show="show">
+    <div class="flex-1">
+        @if($title)
+            <h3 class="font-bold">{{ $title }}</h3>
+        @endif
+        <span>{{ $message }}</span>
+    </div>
+    <button @click="show = false" class="btn btn-sm btn-ghost text-xl">&times;</button>
+</div>
\ No newline at end of file