diff --git a/frontend/index.html b/frontend/index.html
index 72b24fe..b943dea 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -3,6 +3,10 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="theme-color" content="#15202b" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon.png" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="apple-touch-icon" href="/sac-icon.png" />
     <title>Security Alert Center</title>
   </head>
   <body>
diff --git a/frontend/public/favicon.png b/frontend/public/favicon.png
new file mode 100644
index 0000000..9cbe5bf
Binary files /dev/null and b/frontend/public/favicon.png differ
diff --git a/frontend/public/favicon.svg b/frontend/public/favicon.svg
new file mode 100644
index 0000000..9e87c01
--- /dev/null
+++ b/frontend/public/favicon.svg
@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-label="SAC">
+  <rect width="512" height="512" rx="96" fill="#15202b"/>
+  <g fill="none" stroke="#3db8ff" stroke-width="28" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M256 88 L360 128 V248 C360 332 316 388 256 424 C196 388 152 332 152 248 V128 Z"/>
+    <circle cx="256" cy="292" r="22" fill="#3db8ff" stroke="none"/>
+    <path d="M256 270 V210"/>
+    <path d="M196 178 C216 158 236 148 256 148 C276 148 296 158 316 178"/>
+    <path d="M176 198 C206 168 231 153 256 153 C281 153 306 168 336 198"/>
+    <path d="M156 218 C196 178 226 163 256 163 C286 163 316 178 356 218"/>
+  </g>
+</svg>
diff --git a/frontend/public/sac-icon.png b/frontend/public/sac-icon.png
new file mode 100644
index 0000000..eb3bee0
Binary files /dev/null and b/frontend/public/sac-icon.png differ
diff --git a/frontend/src/components/AppSidebar.vue b/frontend/src/components/AppSidebar.vue
index a300d74..7b1e60c 100644
--- a/frontend/src/components/AppSidebar.vue
+++ b/frontend/src/components/AppSidebar.vue
@@ -1,6 +1,12 @@
 <template>
   <aside class="sac-sidebar">
-    <div class="sac-sidebar-brand">{{ appTitle }}</div>
+    <div class="sac-sidebar-brand">
+      <img src="/sac-icon.png" alt="" class="sac-brand-logo" width="40" height="40" />
+      <div class="sac-brand-text">
+        <span class="sac-brand-name">{{ appName }}</span>
+        <span class="sac-brand-version">v.{{ appVersion }}</span>
+      </div>
+    </div>
     <nav class="sac-sidebar-nav" aria-label="Основная навигация">
       <RouterLink
         v-for="item in navItems"
@@ -25,9 +31,10 @@
 <script setup lang="ts">
 import { useRoute, useRouter } from "vue-router";
 import { clearToken } from "../api";
-import { APP_VERSION_LABEL } from "../version";
+import { APP_NAME, APP_VERSION } from "../version";
 
-const appTitle = APP_VERSION_LABEL;
+const appName = APP_NAME;
+const appVersion = APP_VERSION;
 const route = useRoute();
 const router = useRouter();
 
@@ -70,16 +77,42 @@ function logout() {
 }
 
 .sac-sidebar-brand {
-  font-weight: 700;
-  color: #fff;
-  font-size: 0.82rem;
-  line-height: 1.35;
+  display: flex;
+  align-items: center;
+  gap: 0.65rem;
   padding: 0.5rem 0.75rem 0.85rem;
-  white-space: nowrap;
   border-bottom: 1px solid #2a3441;
   margin-bottom: 0.5rem;
 }
 
+.sac-brand-logo {
+  flex-shrink: 0;
+  border-radius: 8px;
+  display: block;
+}
+
+.sac-brand-text {
+  display: flex;
+  flex-direction: column;
+  gap: 0.1rem;
+  min-width: 0;
+}
+
+.sac-brand-name {
+  font-weight: 700;
+  color: #fff;
+  font-size: 0.78rem;
+  line-height: 1.25;
+  white-space: nowrap;
+}
+
+.sac-brand-version {
+  color: #9aa4b2;
+  font-size: 0.72rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
 .sac-sidebar-nav {
   display: flex;
   flex-direction: column;
diff --git a/frontend/src/views/LoginView.vue b/frontend/src/views/LoginView.vue
index b25d7d1..eca74d6 100644
--- a/frontend/src/views/LoginView.vue
+++ b/frontend/src/views/LoginView.vue
@@ -1,6 +1,10 @@
 <template>
-  <div class="card" style="max-width: 360px; margin: 4rem auto">
-    <h1 style="margin-top: 0">Вход в SAC</h1>
+  <div class="card login-card">
+    <div class="login-brand">
+      <img src="/sac-icon.png" alt="" class="login-brand-icon" width="64" height="64" />
+      <h1 class="login-title">Вход в SAC</h1>
+      <p class="login-subtitle">Security Alert Center</p>
+    </div>
     <form @submit.prevent="submit">
       <p>
         <label>Логин<br />
@@ -46,3 +50,34 @@ async function submit() {
   }
 }
 </script>
+
+<style scoped>
+.login-card {
+  max-width: 360px;
+  margin: 4rem auto;
+}
+
+.login-brand {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  margin-bottom: 1.25rem;
+}
+
+.login-brand-icon {
+  border-radius: 12px;
+  margin-bottom: 0.75rem;
+}
+
+.login-title {
+  margin: 0;
+  font-size: 1.35rem;
+}
+
+.login-subtitle {
+  margin: 0.35rem 0 0;
+  color: #9aa4b2;
+  font-size: 0.9rem;
+}
+</style>
