diff --git a/src/components/Settingss/index.js b/src/components/Settingss/index.js
new file mode 100644
index 0000000..78c2e11
--- /dev/null
+++ b/src/components/Settingss/index.js
@@ -0,0 +1,52 @@
+import React from "react";
+import CustomSelectBox from "../CustomSelectBox";
+
+const Settingss = () => {
+  return (
+    <div className="w-full flex flex-row items-center justify-between mx-auto rounded-sm shadow-sm divide-x-2 divide-[#E3E3E3] divide-x-reverse">
+      <div className="flex-grow flex-1 flex flex-col pl-5">
+        <div className="flex flex-col gap-y-7">
+          <CustomSelectBox
+            options={[
+              { title: "نام فرآیند" },
+              { title: "شماره 1" },
+              { title: "شماره 2" },
+              { title: "شماره 3" },
+            ]}
+          />
+          <CustomSelectBox
+            options={[
+              { title: "انتخاب تابع" },
+              { title: "شماره 1" },
+              { title: "شماره 2" },
+              { title: "شماره 3" },
+            ]}
+          />
+        </div>
+      </div>
+      <div className="flex-grow flex-1 flex flex-col pr-5">
+        <p className="mb-4 mt-2 font-bold text-[#00253A] text-sm">تابع پایان</p>
+        <div className="flex flex-col gap-y-7">
+          <CustomSelectBox
+            options={[
+              { title: "انتخاب سرویس" },
+              { title: "شماره 1" },
+              { title: "شماره 2" },
+              { title: "شماره 3" },
+            ]}
+          />
+          <CustomSelectBox
+            options={[
+              { title: "انتخاب تابع" },
+              { title: "شماره 1" },
+              { title: "شماره 2" },
+              { title: "شماره 3" },
+            ]}
+          />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Settingss;
diff --git a/src/components/Tabbar/index.js b/src/components/Tabbar/index.js
index 9363a38..58c005d 100644
--- a/src/components/Tabbar/index.js
+++ b/src/components/Tabbar/index.js
@@ -1,6 +1,7 @@
 import React, { useState } from "react";
 import Button from "../Button";
 import Condition from "../Condition";
+import Settingss from "../Settingss";
 import Tavabee from "../Tavabee";
 
 const Tabbar = ({ tabs }) => {
@@ -39,7 +40,7 @@ Tabbar.defaultProps = {
     {
       title: "تنظیمات",
       className: "rounded-tr-md rounded-br-md border-r-2",
-      components: "mahdiii",
+      components: <Settingss />,
       bg: "bg-transparent",
     },
     {