diff --git a/components/dasboard-components/UserProfile.tsx b/components/dasboard-components/UserProfile.tsx
new file mode 100644
index 0000000..a9522c8
--- /dev/null
+++ b/components/dasboard-components/UserProfile.tsx
@@ -0,0 +1,96 @@
+import { useState } from "react";
+import { Github, Send, Wallet, X, Copy, Pencil } from "lucide-react";
+
+const UserProfile = () => {
+    const [username, setUsername] = useState("Luciferess");
+    const [email, setEmail] = useState("lulubae@gmail.com");
+    const [editingField, setEditingField] = useState<string | null>(null);
+    const [address] = useState("0x742d...f44e");
+
+    return (
+        <div className="bg-zinc-900 rounded-xl p-8 max-w-sm mx-auto mt-8 shadow-lg flex flex-col items-center">
+            {/* Avatar */}
+            <div className="w-20 h-20 rounded-full bg-yellow-200 flex items-center justify-center mb-4 text-5xl">
+                <img
+                    src="/assets/avatar.png"
+                    alt="avatar"
+                    className="w-full h-full rounded-full object-cover"
+                />
+            </div>
+            {/* Username */}
+            <h2 className="text-xl font-semibold text-white mb-1">
+                {username}
+            </h2>
+            {/* Social icons */}
+            <div className="flex gap-4 mb-4 text-zinc-400">
+                <Github size={20} className="hover:text-white cursor-pointer" />
+                <Send size={20} className="hover:text-white cursor-pointer" />
+                <Wallet size={20} className="hover:text-white cursor-pointer" />
+                <X size={20} className="hover:text-white cursor-pointer" />
+            </div>
+            {/* Address row */}
+            <div className="flex w-full gap-2 mb-4">
+                <button className="flex-1 bg-lime-200 text-black rounded px-3 py-2 font-mono flex items-center justify-between text-sm">
+                    {address}
+                    <Copy size={16} className="ml-2" />
+                </button>
+                <button
+                    className="flex-1 bg-zinc-800 text-zinc-400 rounded px-3 py-2 text-sm cursor-not-allowed"
+                    disabled
+                >
+                    + Binding Address
+                </button>
+            </div>
+            {/* Username field */}
+            <div className="w-full mb-3">
+                <label className="text-xs text-zinc-400">Username</label>
+                <div className="relative mt-1">
+                    <input
+                        type="text"
+                        value={username}
+                        readOnly={editingField !== "username"}
+                        onChange={(e) => setUsername(e.target.value)}
+                        className="w-full bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition pr-8"
+                    />
+                    <button
+                        type="button"
+                        className="absolute right-2 top-1/2 -translate-y-1/2 text-zinc-400 hover:text-white"
+                        onClick={() =>
+                            setEditingField(
+                                editingField === "username" ? null : "username"
+                            )
+                        }
+                    >
+                        <Pencil size={16} />
+                    </button>
+                </div>
+            </div>
+            {/* Email field */}
+            <div className="w-full">
+                <label className="text-xs text-zinc-400">Email address</label>
+                <div className="relative mt-1">
+                    <input
+                        type="email"
+                        value={email}
+                        readOnly={editingField !== "email"}
+                        onChange={(e) => setEmail(e.target.value)}
+                        className="w-full bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition pr-8"
+                    />
+                    <button
+                        type="button"
+                        className="absolute right-2 top-1/2 -translate-y-1/2 text-zinc-400 hover:text-white"
+                        onClick={() =>
+                            setEditingField(
+                                editingField === "email" ? null : "email"
+                            )
+                        }
+                    >
+                        <Pencil size={16} />
+                    </button>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default UserProfile;
diff --git a/components/dashboard-components/CreateCampaignForm.tsx b/components/dashboard-components/CreateCampaignForm.tsx
new file mode 100644
index 0000000..6569cba
--- /dev/null
+++ b/components/dashboard-components/CreateCampaignForm.tsx
@@ -0,0 +1,99 @@
+import { useState } from "react";
+import { Plus } from "lucide-react";
+
+const CreateCampaignForm = () => {
+    const [tasks, setTasks] = useState<string[]>([]);
+    const [taskInput, setTaskInput] = useState("");
+
+    const handleAddTask = () => {
+        if (taskInput.trim()) {
+            setTasks([...tasks, taskInput.trim()]);
+            setTaskInput("");
+        }
+    };
+
+    return (
+        <form className="bg-zinc-900 rounded-xl p-8 max-w-4xl mx-auto mt-8 shadow-lg">
+            <div className="flex justify-between items-center mb-6">
+                <h2 className="text-2xl font-semibold text-white">
+                    New Campaign
+                </h2>
+                <button
+                    type="submit"
+                    className="bg-lime-200 text-black font-medium px-5 py-2 rounded shadow hover:bg-lime-300 transition"
+                >
+                    Create campaign
+                </button>
+            </div>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div className="flex flex-col gap-4">
+                    <label className="text-sm text-white">
+                        Name
+                        <input
+                            type="text"
+                            className="mt-1 w-full bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition"
+                        />
+                    </label>
+                    <label className="text-sm text-white">
+                        Date
+                        <div className="flex items-center gap-2 mt-1">
+                            <input
+                                type="date"
+                                className="w-1/2 bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition"
+                            />
+                            <span className="text-zinc-400">to</span>
+                            <input
+                                type="date"
+                                className="w-1/2 bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition"
+                            />
+                        </div>
+                    </label>
+                </div>
+                <div className="flex flex-col gap-4">
+                    <label className="text-sm text-white">
+                        Campaign description
+                        <input
+                            type="text"
+                            className="mt-1 w-full bg-transparent border border-zinc-600 rounded px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition"
+                        />
+                    </label>
+                    <label className="text-sm text-white">
+                        Add tasks
+                        <div className="flex mt-1">
+                            <input
+                                type="text"
+                                value={taskInput}
+                                onChange={(e) => setTaskInput(e.target.value)}
+                                className="flex-1 bg-transparent border border-zinc-600 rounded-l px-3 py-2 text-white focus:outline-none focus:border-lime-200 transition"
+                                placeholder="Task description"
+                            />
+                            <button
+                                type="button"
+                                onClick={handleAddTask}
+                                className="bg-lime-200 text-black px-4 rounded-r flex items-center justify-center hover:bg-lime-300 transition border border-lime-200 border-l-0"
+                                aria-label="Add task"
+                            >
+                                <Plus size={20} />
+                            </button>
+                        </div>
+                        {/* Show added tasks */}
+                        {tasks.length > 0 && (
+                            <ul className="mt-2 space-y-1">
+                                {tasks.map((task, idx) => (
+                                    <li
+                                        key={idx}
+                                        className="text-xs text-lime-200 bg-zinc-800 rounded px-2 py-1 inline-block"
+                                    >
+                                        {task}
+                                    </li>
+                                ))}
+                            </ul>
+                        )}
+                    </label>
+                </div>
+            </div>
+        </form>
+    );
+};
+
+export default CreateCampaignForm;
diff --git a/package-lock.json b/package-lock.json
index e11e9f2..83b084a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3829,6 +3829,7 @@
             "version": "0.511.0",
             "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.511.0.tgz",
             "integrity": "sha512-VK5a2ydJ7xm8GvBeKLS9mu1pVK6ucef9780JVUjw6bAjJL/QXnd4Y0p7SPeOUMC27YhzNCZvm5d/QX0Tp3rc0w==",
+            "license": "ISC",
             "peerDependencies": {
                 "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0"
             }