diff --git a/ui/assets/PersonaFlowIcon-512.png b/ui/assets/PersonaFlowIcon-512.png
new file mode 100644
index 0000000..62b6fd9
Binary files /dev/null and b/ui/assets/PersonaFlowIcon-512.png differ
diff --git a/ui/src/components/features/header/components/header.tsx b/ui/src/components/features/header/components/header.tsx
index f205920..6b82178 100644
--- a/ui/src/components/features/header/components/header.tsx
+++ b/ui/src/components/features/header/components/header.tsx
@@ -3,12 +3,17 @@ import { Button } from "@/components/ui/button";
 import { AssistantSelector } from "../../build-panel/components/assistant-selector";
 import { useRouter } from "next/navigation";
 import { Plus } from "lucide-react";
+import PersonaFlowIcon from '../../../../../assets/PersonaFlowIcon-512.png'
+import Image from "next/image";
 
 export default function Header() {
   const router = useRouter()
   return (
     <div className="flex gap-2 m-2 justify-between">
-      <h1>[ personaflow ]</h1>
+      <div className="flex gap-4 items-center">
+      <Image className="rounded" src={PersonaFlowIcon} alt="PersonaFlow logo" width={40} height={40}/>
+        <h1>[ personaflow ]</h1>
+        </div>
       <div className="flex gap-2">
        <AssistantSelector />
         <Button