diff --git a/frontend/components/profile/ProfileSidebar.vue b/frontend/components/profile/ProfileSidebar.vue
new file mode 100644
index 0000000..5bebcda
--- /dev/null
+++ b/frontend/components/profile/ProfileSidebar.vue
@@ -0,0 +1,36 @@
+<script setup lang="ts">
+// imports
+
+import useGetAccount from "~/composables/api/account/useGetAccount";
+
+// queries
+
+const { data: account, suspense } = useGetAccount();
+
+await suspense();
+</script>
+
+<template>
+    <div class="w-3/12 flex flex-col gap-4">
+        <div class="w-full rounded-xl bg-slate-50 border border-slate-200 p-4">
+            <div class="flex items-center justify-between w-full">
+                <div class="flex flex-col items-start gap-1">
+                    <span class="flex font-semibold text-dynamic-primary">
+                        <p>
+                            {{ `${account?.first_name} ${account?.last_name}` }}
+                        </p>
+                    </span>
+                    <button class="text-xs font-semibold text-cyan-500">
+                        ویرایش اطلاعات
+                    </button>
+                </div>
+                <img
+                    src="https://shatelpart.com/storage/users/user-15-155Mn1.png"
+                    class="rounded-full size-[3rem] hover:border-dynamic-rose transition"
+                />
+            </div>
+        </div>
+    </div>
+</template>
+
+<style scoped></style>