diff --git a/src/components/Reminders/AddEditReminder.jsx b/src/components/Reminders/AddEditReminder.jsx
new file mode 100644
index 0000000..94c4f1c
--- /dev/null
+++ b/src/components/Reminders/AddEditReminder.jsx
@@ -0,0 +1,119 @@
+import React from 'react'
+import Layout from '../Partials/Layout'
+import { Link } from 'react-router-dom'
+import InputCom from "../Helpers/Inputs/InputCom";
+
+
+export default function AddEditReminder({ className }) {
+  return (
+    <>
+      <Layout>
+        <div className="content-wrapper-profile-only w-full mb-6">
+        <div className="history-wrapper w-full mb-10">
+            
+        <div
+      className={`update-table w-full p-8 bg-white dark:bg-dark-white   overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
+        className || ""
+      }`}
+    >
+           
+		  <div className="fields w-full">
+               {/*description */}
+               <div className="field w-full mb-6">
+              <InputCom
+                label="Description"
+                type="text"
+                name="description"
+                placeholder="Describe the Reminder"
+                value={''}
+              />
+            </div>
+
+             {/* first name and last name */}
+             <div className="xl:flex xl:space-x-7 mb-6">
+              <div className="field w-full mb-6 xl:mb-0">
+                <InputCom
+                  label="Reminder Type"
+                  type="text"
+                  name="remType"
+                  placeholder="Drop down of Category"
+                  value={''}
+                />
+              </div>
+              <div className="field w-full">
+                <InputCom
+                  label="Mode"
+                  type="text"
+                  name="remMode"
+                  placeholder="Drop down of Modes"
+                  value={''}
+                />
+              </div>
+            </div>
+
+            <div className="xl:flex xl:space-x-7 mb-6">
+              <div className="field w-full mb-6 xl:mb-0">
+                <InputCom
+                  label="Start Date"
+                  type="text"
+                  name="startDate"
+                  placeholder="10-10-2021"
+                  value={''}
+                />
+              </div>
+              <div className="field w-full">
+                <InputCom
+                  label="End Date"
+                  type="text"
+                  name="endDate"
+                  placeholder="10-20-2034"
+                  value={''}
+                />
+              </div>
+            </div>
+
+            {/* bio */}
+            <div className="field w-full mb-6">
+              <h1 className="field-title">Optional Details </h1>
+              <div className="input-field mt-2">
+                <div className="input-wrapper w-full ">
+                  <textarea
+                    value={''}
+                    placeholder="provide a detailed description of your item."
+                    rows="7"
+                    className="w-full h-full px-7 py-4  border border-light-purple dark:border-[#5356fb29]  rounded-[20px] text-dark-gray dark:text-white bg-[#FAFAFA] dark:bg-[#11131F]  focus:ring-0 focus:outline-none"
+                  />
+                </div>
+              </div>
+            </div>
+
+       
+          </div>
+          {/* border line */}
+          <div className="w-full h-[120px] border-t border-light-purple dark:border-[#5356fb29]  flex justify-end items-center">
+          <div className="flex space-x-4 mr-9">
+            <button
+              type="button"
+              className="text-18 text-light-red tracking-wide "
+            >
+              <span className="border-b dark:border-[#5356fb29]  border-light-red">
+                {" "}
+                Cancel
+              </span>
+            </button>
+
+            <button
+              type="button"
+              className="w-[152px] h-[46px] flex justify-center items-center btn-gradient text-base rounded-full text-white"
+            >
+              Upadate
+            </button>
+          </div>
+        </div>
+        </div>
+</div>
+        </div>
+      </Layout>
+    </>
+  )
+}
diff --git a/src/views/RemindersAddPage.jsx b/src/views/RemindersAddPage.jsx
index 84d3531..11c55af 100644
--- a/src/views/RemindersAddPage.jsx
+++ b/src/views/RemindersAddPage.jsx
@@ -1,10 +1,10 @@
 import React from "react";
-import Reminders from "../components/Reminders";
+import AddEditReminder from "../components/Reminders/AddEditReminder";
 
 export default function RemindersAddPage() {
   return (
     <>
-      <Reminders />
+      <AddEditReminder />
     </>
   );
 }