diff --git a/ui/assets/logo.png b/ui/assets/logo.png
new file mode 100644
index 0000000..e390c52
Binary files /dev/null and b/ui/assets/logo.png differ
diff --git a/ui/header.tsx b/ui/header.tsx
index 33a9f69..6239b5e 100644
--- a/ui/header.tsx
+++ b/ui/header.tsx
@@ -1,4 +1,6 @@
 import { Button, Card, Icon } from "@blueprintjs/core";
+import Image from "next/image";
+import logoImg from "./assets/logo.png";
 import { GitHubIcon } from "./custom-icons";
 import { useDarkMode } from "./providers/dark-mode-provider";
 
@@ -7,8 +9,11 @@ export const Header = ({ langName }: { langName: string }) => {
 
   const brandSection = (
     <div style={{ flex: 1, textAlign: "left" }}>
-      <Button minimal large icon={<Icon icon="code-block" intent="primary" />}>
-        Esolang Park
+      <Button minimal large>
+        <div style={{ display: "flex", alignItems: "center" }}>
+          <Image src={logoImg} width={20} height={20} />
+          <span style={{ marginLeft: 10 }}>Esolang Park</span>
+        </div>
       </Button>
     </div>
   );