diff --git a/src/dashboard/example/main.vue b/src/dashboard/example/main.vue
index b75a2a9..2b08262 100644
--- a/src/dashboard/example/main.vue
+++ b/src/dashboard/example/main.vue
@@ -16,6 +16,8 @@ const activeLabel = computed(() => {
   const match = menuItems.find((item) => item.to === route.path);
   return match?.label ?? 'Dashboard';
 });
+
+const logoUrl = new URL('./image.png', import.meta.url).href;
 </script>
 
 <template>
@@ -32,9 +34,29 @@ const activeLabel = computed(() => {
       bordered
       :width="220"
     >
-      <QToolbar class="text-weight-bold">
-        Control Panel
-      </QToolbar>
+      <div class="sidebar-header q-pa-md">
+        <div class="row items-center no-wrap">
+          <img
+            :src="logoUrl"
+            alt="Logo"
+            class="sidebar-logo"
+          />
+          <div class="q-ml-sm">
+            <div class="text-subtitle1 text-weight-bold">
+              Control Panel
+            </div>
+            <div class="text-caption text-grey-6">
+              <span class="by-label">by</span><a
+                class="by-link"
+                href="https://github.com/Pandipipas"
+                target="_blank"
+                rel="noopener"
+              >Pandipipas</a>
+            </div>
+          </div>
+        </div>
+      </div>
+      <QSeparator class="q-mb-sm" />
       <QList>
         <QItem
           v-for="item in menuItems"
@@ -58,3 +80,29 @@ const activeLabel = computed(() => {
     </QPageContainer>
   </QLayout>
 </template>
+
+<style scoped>
+.sidebar-header {
+  min-height: 72px;
+}
+
+.sidebar-logo {
+  width: 40px;
+  height: 40px;
+  object-fit: contain;
+}
+
+.by-label {
+  font-size: 0.75rem;
+}
+
+.by-link {
+  font-size: 0.75rem;
+  color: inherit;
+  text-decoration: none;
+}
+
+.by-link:hover {
+  text-decoration: underline;
+}
+</style>