diff --git a/front/src/App.vue b/front/src/App.vue
index 2a68fa7..2293851 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -48,7 +48,7 @@ onMounted(async () => {
       </div>
     </div>
     <div class="main" v-else>
-      <img class="logo-img" src="./assets/logo.png" />
+      <img class="logo-img" src="./assets/logo_color.png" />
     </div>
   </div>
 </template>
\ No newline at end of file
diff --git a/front/src/assets/logo_color.png b/front/src/assets/logo_color.png
new file mode 100644
index 0000000..faad325
Binary files /dev/null and b/front/src/assets/logo_color.png differ
diff --git a/front/src/assets/main.scss b/front/src/assets/main.scss
index df3b243..ba78007 100644
--- a/front/src/assets/main.scss
+++ b/front/src/assets/main.scss
@@ -1,10 +1,9 @@
 @import '../../node_modules/reset-css/sass/reset';
 
+$blackColor: #181818;
 $accentColor: #ef570c;
+$redColor: #f83300;
 
-body {
-  font-family: 'main';
-}
 
 @font-face {
   font-family: 'logo';
@@ -16,6 +15,12 @@ body {
   src: url('../fonts/main.otf');
 }
 
+body {
+  font-family: 'main';
+  background: $blackColor;
+  color: #fff;
+}
+
 .container {
   display: grid;
   grid-template-columns: 16rem 1fr;
@@ -97,9 +102,9 @@ body {
     font-family: 'logo';
     font-size: 4rem;
 
-      background: linear-gradient(45deg, black, #ff3600);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
+    background: linear-gradient(45deg, $redColor, $accentColor);
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
   }
 
   &-img {