diff --git a/.changes/update-logo.md b/.changes/update-logo.md
new file mode 100644
index 0000000..9f2e4f4
--- /dev/null
+++ b/.changes/update-logo.md
@@ -0,0 +1,5 @@
+---
+"algohub": patch:feat
+---
+
+Update logo to use `.svg` file instead of `.png`.
diff --git a/.cspell.json b/.cspell.json
index 9cdd818..830fbb8 100644
--- a/.cspell.json
+++ b/.cspell.json
@@ -10,6 +10,7 @@
         "covector",
         "dtolnay",
         "emptydirs",
+        "evenodd",
         "farmfe",
         "Gridlines",
         "icns",
diff --git a/public/acm-light.png b/public/acm-light.png
deleted file mode 100644
index 93058ae..0000000
Binary files a/public/acm-light.png and /dev/null differ
diff --git a/public/acm.png b/public/acm.png
deleted file mode 100644
index b2a41e1..0000000
Binary files a/public/acm.png and /dev/null differ
diff --git a/public/algohub-day.svg b/public/algohub-day.svg
new file mode 100644
index 0000000..2b603b7
--- /dev/null
+++ b/public/algohub-day.svg
@@ -0,0 +1 @@
+<svg data-name="algohub" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 896.14"><defs><style>.cls-1{fill:#df3821;}.cls-1,.cls-2,.cls-3,.cls-4,.cls-5{fill-rule:evenodd;}.cls-2{fill:#648dcb;}.cls-3{fill:#fbeb78;}.cls-4{fill:#b9e185;}</style></defs><path class="cls-1" d="M0,158.23C0,98.55,48.23,50.16,107.72,50.16S215.44,98.55,215.44,158.23,167.21,266.3,107.72,266.3,0,217.92,0,158.23Z" transform="translate(0 -50.16)"/><path class="cls-2" d="M544.56,266.31a47,47,0,1,1,47,47,47,47,0,0,1-47-47Z" transform="translate(0 -50.16)"/><path class="cls-2" d="M741.75,266.31a47,47,0,1,1,47,47,47,47,0,0,1-47-47Z" transform="translate(0 -50.16)"/><polygon class="cls-3" points="0 522.11 215.44 522.11 215.44 896.14 0 896.14 0 522.11 0 522.11"/><polygon class="cls-4" points="784.56 508.07 1000 508.07 1000 741.05 784.56 741.05 784.56 508.07 784.56 508.07"/><path class="cls-5" d="M292,279.66q-15.39,5.13-48.74,12.26t-43.62,14Q184,317,184,334.12q0,16.83,12.55,29.08t31.92,12.26q21.67,0,41.34-14.25,14.53-10.84,19.1-26.52Q292,324.43,292,295.63ZM243.26,115.43q53.6,0,79.81,12.69T360,160.34q10.69,19.53,10.69,71.7l-.85,93.53q0,39.92,3.84,58.87t14.4,40.64H308.82q-3.13-8-7.69-23.67-2-7.12-2.86-9.41-20.52,20-43.9,29.94a125.73,125.73,0,0,1-49.88,10q-46.76,0-73.69-25.38t-26.94-64.15q0-25.67,12.26-45.76a80.11,80.11,0,0,1,34.35-30.8q22.1-10.69,63.71-18.67Q270.34,236.6,292,227.48v-8q0-23.1-11.4-32.93t-43-9.84q-21.39,0-33.36,8.41t-19.38,29.51l-72.69-13.11q12.25-43.92,42.19-65t88.94-21.1Z" transform="translate(0 -50.16)"/><path class="cls-5" d="M254.17,507q55.29,0,87.93,23.75T389,603.17l-79,14.22q-4-23.61-18.1-35.56t-36.62-12q-29.94,0-47.75,20.63t-17.81,69q0,53.76,18.1,76t48.6,22.19q22.8,0,37.34-12.95t20.52-44.52L393,713.55q-12.25,54.06-47,81.65t-93.21,27.6q-66.42,0-105.89-41.82T107.37,665.19q0-74.84,39.62-116.5T254.17,507Z" transform="translate(0 -50.16)"/><path class="cls-5" d="M611.56,391.22q29.06,0,50.42,12t35,36.19q19.93-24.22,43-36.19a105.48,105.48,0,0,1,49.28-12q33.33,0,56.4,13.53t34.46,39.76q8.26,19.37,8.26,62.69V700.69h-80v-173q0-45-8.26-58.14-11.1-17.1-34.18-17.1-16.8,0-31.61,10.26T713,492.81q-6.54,19.8-6.55,62.55V700.69h-80V534.84q0-44.18-4.27-57t-13.24-19.1q-9-6.27-24.36-6.27a58.29,58.29,0,0,0-33.32,10q-14.82,10-21.22,28.78t-6.41,62.41v147h-80V398.06h73.77v41.32q39.6-48.17,94.28-48.16Z" transform="translate(0 -50.16)"/></svg>
\ No newline at end of file
diff --git a/public/algohub-night.svg b/public/algohub-night.svg
new file mode 100644
index 0000000..ce43470
--- /dev/null
+++ b/public/algohub-night.svg
@@ -0,0 +1 @@
+<svg data-name="algohub" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 896.14"><defs><style>.cls-1{fill:#df3821;}.cls-1,.cls-2,.cls-3,.cls-4,.cls-5{fill-rule:evenodd;}.cls-2{fill:#648dcb;}.cls-3{fill:#fbeb78;}.cls-4{fill:#b9e185;}.cls-5{fill:#fff;}</style></defs><path class="cls-1" d="M0,158.23C0,98.55,48.23,50.16,107.72,50.16S215.44,98.55,215.44,158.23,167.21,266.3,107.72,266.3,0,217.92,0,158.23Z" transform="translate(0 -50.16)"/><path class="cls-2" d="M544.56,266.31a47,47,0,1,1,47,47,47,47,0,0,1-47-47Z" transform="translate(0 -50.16)"/><path class="cls-2" d="M741.75,266.31a47,47,0,1,1,47,47,47,47,0,0,1-47-47Z" transform="translate(0 -50.16)"/><polygon class="cls-3" points="0 522.11 215.44 522.11 215.44 896.14 0 896.14 0 522.11 0 522.11"/><polygon class="cls-4" points="784.56 508.07 1000 508.07 1000 741.05 784.56 741.05 784.56 508.07 784.56 508.07"/><path class="cls-5" d="M292,279.66q-15.39,5.13-48.74,12.26t-43.62,14Q184,317,184,334.12q0,16.83,12.55,29.08t31.92,12.26q21.67,0,41.34-14.25,14.53-10.84,19.1-26.52Q292,324.43,292,295.63ZM243.26,115.43q53.6,0,79.81,12.69T360,160.34q10.69,19.53,10.69,71.7l-.85,93.53q0,39.92,3.84,58.87t14.4,40.64H308.82q-3.13-8-7.69-23.67-2-7.12-2.86-9.41-20.52,20-43.9,29.94a125.73,125.73,0,0,1-49.88,10q-46.76,0-73.69-25.38t-26.94-64.15q0-25.67,12.26-45.76a80.11,80.11,0,0,1,34.35-30.8q22.1-10.69,63.71-18.67Q270.34,236.6,292,227.48v-8q0-23.1-11.4-32.93t-43-9.84q-21.39,0-33.36,8.41t-19.38,29.51l-72.69-13.11q12.25-43.92,42.19-65t88.94-21.1Z" transform="translate(0 -50.16)"/><path class="cls-5" d="M254.17,507q55.29,0,87.93,23.75T389,603.17l-79,14.22q-4-23.61-18.1-35.56t-36.62-12q-29.94,0-47.75,20.63t-17.81,69q0,53.76,18.1,76t48.6,22.19q22.8,0,37.34-12.95t20.52-44.52L393,713.55q-12.25,54.06-47,81.65t-93.21,27.6q-66.42,0-105.89-41.82T107.37,665.19q0-74.84,39.62-116.5T254.17,507Z" transform="translate(0 -50.16)"/><path class="cls-5" d="M611.56,391.22q29.06,0,50.42,12t35,36.19q19.93-24.22,43-36.19a105.48,105.48,0,0,1,49.28-12q33.33,0,56.4,13.53t34.46,39.76q8.26,19.37,8.26,62.69V700.69h-80v-173q0-45-8.26-58.14-11.1-17.1-34.18-17.1-16.8,0-31.61,10.26T713,492.81q-6.54,19.8-6.55,62.55V700.69h-80V534.84q0-44.18-4.27-57t-13.24-19.1q-9-6.27-24.36-6.27a58.29,58.29,0,0,0-33.32,10q-14.82,10-21.22,28.78t-6.41,62.41v147h-80V398.06h73.77v41.32q39.6-48.17,94.28-48.16Z" transform="translate(0 -50.16)"/></svg>
\ No newline at end of file
diff --git a/src/components/UniversalToolBar.vue b/src/components/UniversalToolBar.vue
index 45345d9..1fe3c0b 100644
--- a/src/components/UniversalToolBar.vue
+++ b/src/components/UniversalToolBar.vue
@@ -145,7 +145,7 @@ const toString = (value: any) => {
     <div class="bg-gray-100 dark:bg-zinc-900 flex flex-row items-center justify-between w-full py-3 px-5 flex-wrap"
         :class="{ 'border-b-[1.2px] border-zinc-300 dark:border-zinc-600 shadow-sm': separateBottom ?? true }">
         <div class="inline-flex justify-center items-center">
-            <img @click="router.push('/')" class="cursor-pointer" :src="themeStore.dark ? '/acm-light.png' : '/acm.png'"
+            <img @click="router.push('/')" class="cursor-pointer" :src="themeStore.logo"
                 width="40"></img>
             <Breadcrumb v-if="path?.length" :model="path" class="!bg-transparent !p-0">
                 <template #item="{ item }">
diff --git a/src/scripts/store.ts b/src/scripts/store.ts
index 7a0dc43..0c85a87 100644
--- a/src/scripts/store.ts
+++ b/src/scripts/store.ts
@@ -31,7 +31,7 @@ export const useThemeStore = defineStore(
       }
     };
     const icon = computed(() => (dark.value ? "pi pi-moon" : "pi pi-sun"));
-    const logo = computed(() => (dark.value ? "/acm-light.png" : "/acm.png"));
+    const logo = computed(() => (dark.value ? "/algohub-night.svg" : "/algohub-day.svg"));
     return { dark, toggle, init, icon, logo };
   },
   {
diff --git a/src/views/login.vue b/src/views/login.vue
index c8b6f8e..42fd677 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -69,7 +69,7 @@ const onLogin = async ({ valid, states }: { valid: boolean, states: LoginForm<Re
   <div class="flex flex-row h-full">
     <div class="hidden md:flex flex-col items-center justify-center h-full w-full">
       <div class="flex flex-1 flex-col items-center justify-center w-full h-full">
-        <Image class="hidden md:flex" :src="themeStore.dark ? '/acm-light.png' : '/acm.png'" alt="Image" width="250" />
+        <Image class="hidden md:flex" :src="themeStore.logo" alt="Image" width="250" />
         <h1 class="text-3xl md:text-4xl font-bold mt-6 md:m-0">ACM Algorithm Hub</h1>
       </div>
       <footer class="flex flex-row items-start w-full">