diff --git a/assets/favicon.png b/assets/favicon.png
new file mode 100644
index 0000000..0193d1c
Binary files /dev/null and b/assets/favicon.png differ
diff --git a/css/base.css b/css/base.css
index 418cf0f..4e6f573 100644
--- a/css/base.css
+++ b/css/base.css
@@ -11,11 +11,13 @@
 /* font-family: "Special Gothic Expanded One", sans-serif; */
 
 :root {
-    --font: #c4e5f2;
-    --bg-dark: #010d26;
-    --bg-light: #9cc1d9;
-    --btn: #0000cc;
-    --btn-dark: #000080;
+    --blackglass: #0000007a;
+    --font: #a4a5a6;
+    --bg-dark: #0a0b0d;
+    --bg-light: #2d3540;
+    --btn: #84e9ff;
+    --btn-dark: #1c2026;
+    --against-color: #84e9ffa7;
 }
 
 ::-webkit-scrollbar {
@@ -44,7 +46,8 @@ body {
     min-height: 100vh;
 }
 
-#btn {
+#btn,
+.btn {
     cursor: pointer;
     background-color: var(--btn);
     padding: 1.5dvh;
@@ -53,6 +56,7 @@ body {
     transition: 0.3s;
 }
 
-#btn:hover {
+#btn:hover,
+.btn:hover {
     background-color: var(--btn-dark);
 }
diff --git a/css/home.css b/css/home.css
index f449f8e..80eb3a7 100644
--- a/css/home.css
+++ b/css/home.css
@@ -4,10 +4,20 @@
     align-items: center;
     border-bottom: solid 2px var(--btn);
     min-height: 5dvw;
-    background-color: #0000007a;
+    background-color: var(--blackglass);
+
     label {
-        padding: 1dvw;
+        margin: 0 0 0 1dvw;
+        width: 5dvh;
+        height: 5dvh;
+        background-color: var(--font);
+        background-image: url("../assets/favicon.png");
+        background-position: center;
+        background-size: 4dvh;
+        background-repeat: no-repeat;
+        border-radius: 100%;
     }
+
     ul {
         position: absolute;
         display: flex;
@@ -18,6 +28,10 @@
         height: 100%;
         li {
             margin: 0 1dvw 0 1dvw;
+            color: var(--bg-dark);
+        }
+        li:hover {
+            color: var(--font);
         }
     }
 }
@@ -39,6 +53,9 @@
             font-weight: 900;
         }
         label {
+            margin: 2dvw 0 0 0;
+            display: flex;
+            text-align: center;
             word-break: break-all;
             font-weight: 400;
             font-size: 1.5em;
@@ -49,7 +66,6 @@
         width: 50%;
         li {
             position: relative;
-            background-color: #0000007a;
             border-radius: 100vw;
             border: solid 2px var(--btn);
             display: flex;
@@ -80,9 +96,15 @@
                 justify-content: center;
                 align-items: center;
                 transition: 0.3s;
+                span {
+                    color: var(--bg-dark);
+                }
             }
             a:hover {
                 background-color: var(--btn-dark);
+                span {
+                    color: var(--font);
+                }
             }
         }
     }
diff --git a/css/inicio.css b/css/inicio.css
index f5c6a67..cbf0769 100644
--- a/css/inicio.css
+++ b/css/inicio.css
@@ -1,5 +1,5 @@
 #posts {
-    background-color: #0000007a;
+    background-color: var(--blackglass);
     padding: 4dvw 0 4dvw 0;
     margin: 4dvw 0 0 0;
     width: 100%;
@@ -51,7 +51,7 @@
             box-shadow: 0 0 0 #000000;
         }
         a:hover {
-            box-shadow: 0 0 5vw #84e9ffa7;
+            box-shadow: 0 0 5vw var(--against-color);
             z-index: 100;
         }
     }
diff --git a/css/sing.css b/css/sing.css
index 26bc37f..614955b 100644
--- a/css/sing.css
+++ b/css/sing.css
@@ -1,135 +1,102 @@
 * {
-    margin: 0;
-    padding: 0;
     box-sizing: border-box;
-    font-family: 'Inter', sans-serif;
+    font-family: "Inter", sans-serif;
 }
 
-
 body {
-    background-color: #1d1d1d; 
     display: flex;
     justify-content: center;
     align-items: center;
-    min-height: 100vh;
-    overflow: hidden; 
 }
 
-
 .form-wrapper {
-    position: relative; 
-    width: 350px; 
-    height: 450px; 
-    overflow: hidden; 
-    border-radius: 20px; 
-    box-shadow: 0 0 20px rgba(0,0,0,0.5); 
-    background-color: #0000001e; /
+    position: relative;
+    width: 350px;
+    height: 450px;
+    overflow: hidden;
+    border-radius: 20px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
+    background-color: var(--blackglass);
 }
 
-
 .login-container,
 .register-container {
     padding: 40px;
-    width: 100%; 
+    width: 100%;
     text-align: center;
-    position: absolute; 
+    position: absolute;
     top: 0;
     left: 0;
-    transition: transform 0.6s ease-in-out; 
+    transition: transform 0.6s ease-in-out;
 }
 
-
 .login-container.active {
     transform: translateX(0%);
 }
 
-
 .register-container {
     transform: translateX(100%);
 }
 
-
 .register-container.active {
     transform: translateX(0%);
 }
 
-
 .login-container:not(.active) {
     transform: translateX(-100%);
 }
 
-
 .login-container h2,
 .register-container h2 {
-    color: white;
+    color: var(--btn);
     margin-bottom: 30px;
     font-weight: 500;
 }
 
-
 .input-box {
     position: relative;
     margin-bottom: 20px;
 }
 
-
 .input-box i {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     left: 10px;
-    color: white;
+    color: var(--btn);
     z-index: 2;
 }
 
-
 .input-box input {
     width: 100%;
     padding: 10px 10px 10px 35px;
     border: none;
     border-radius: 10px;
-    background: #1f1f1f;
-    color: white;
+    background: var(--bg-light);
+    color: var(--btn);
     box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8);
     transition: all 0.2s ease-in-out;
 }
 
-
-.input-box input::placeholder {
-    color: transparent;
-    transition: opacity 0.2s ease;
-}
-
-
-.input-box input:focus::placeholder {
-    opacity: 1;
-    color: #555;
-}
-
-
 .input-box label {
     position: absolute;
     top: 50%;
     left: 35px;
     transform: translateY(-50%);
-    color: #aaa;
+    color: var(--btn);
     pointer-events: none;
     transition: all 0.2s ease-in-out;
     z-index: 2;
 }
 
-
 .input-box input:focus + label,
 .input-box input:not(:placeholder-shown) + label {
-    top: -15px; 
-    transform: translateY(-50%) translatex(-60%)scale(0.85); 
+    top: -15px;
+    transform: translateY(-50%) translatex(-60%) scale(0.85);
     font-size: 0.9em;
-    color: #ffffff;
-    background-color: #1d1d1d; 
     padding: 0 5px;
 }
 
-
 .buttons {
     display: flex;
     justify-content: space-between;
@@ -137,18 +104,14 @@ body {
 }
 
 .btn {
-    width: 48%; 
+    width: 48%;
     padding: 10px;
-    background-color: #0000cc;
     border: none;
-    border-radius: 8px;
-    color: white;
-    cursor: pointer;
-    transition: background-color 0.3s;
+    color: var(--bg-dark);
 }
 
 .btn:hover {
-    background-color: #444;
+    color: var(--btn);
 }
 
 .forgot {
@@ -156,7 +119,6 @@ body {
     margin-top: 10px;
 }
 
-
 .register-container form {
     margin-top: 20px;
 }
@@ -166,15 +128,13 @@ body {
     text-align: left;
 }
 
-
 .form-group input {
-   
     padding: 12px 10px;
     border: none;
     border-radius: 5px;
     font-size: 16px;
-    background: #1f1f1f;
-    color: white;
+
+    color: var(--btn);
     box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8);
     z-index: 1;
 }
@@ -184,73 +144,20 @@ body {
     padding: 15px;
     border: none;
     border-radius: 5px;
-    font-size: 18px;
-    cursor: pointer;
-    transition: background-color 0.3s ease;
-    background-color: #0000cc;
-    color: white;
     margin-top: 20px;
 }
 
 .register-button:hover {
-    background-color: #444;
+    color: var(--btn);
 }
 
-
 #showLoginBtn {
     width: 100%;
+    color: var(--btn);
     margin-top: 15px;
-    background-color: #555;
+    background-color: #00000000;
 }
 
 #showLoginBtn:hover {
-    background-color: #777;
+    color: var(--bg-light);
 }
-
-
-.custom-alert-hidden {
-    display: none;
-}
-
-.custom-alert-visible {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.7);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000;
-}
-
-.custom-alert-content {
-    background-color: #333;
-    padding: 30px;
-    border-radius: 10px;
-    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
-    text-align: center;
-    color: white;
-    max-width: 300px;
-}
-
-.custom-alert-content p {
-    margin-bottom: 20px;
-    font-size: 1.1em;
-}
-
-.custom-alert-content button {
-    background-color: #0000cc;
-    color: white;
-    padding: 10px 20px;
-    border: none;
-    border-radius: 5px;
-    cursor: pointer;
-    font-size: 1em;
-    transition: background-color 0.3s;
-}
-
-.custom-alert-content button:hover {
-    background-color: #444;
-}
\ No newline at end of file
diff --git a/index.php b/index.php
index e374693..43e2756 100644
--- a/index.php
+++ b/index.php
@@ -3,6 +3,7 @@
     <head>
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <link rel="icon" type="image/x-icon" href="assets/favicon.png">
         <link rel="stylesheet" href="css/base.css" />
         <link rel="stylesheet" href="css/home.css" />
         <script type="text/javascript" src="javascript/libs/vanila.js"></script>
@@ -10,7 +11,7 @@
     </head>
     <body>
         <div id="menu">
-            <label>Logo</label>
+            <label></label>
             <header>
                 <ul>
                     <a href="index.php"><li id="btn">
diff --git a/javascript/singForm.js b/javascript/sing.js
similarity index 100%
rename from javascript/singForm.js
rename to javascript/sing.js
diff --git a/sing.php b/sing.php
index 818ca58..163845d 100644
--- a/sing.php
+++ b/sing.php
@@ -48,19 +48,12 @@
                     <input type="password" id="registerPassword" name="password" placeholder=" ">
                     <label for="registerPassword">Senha</label>
                 </div>
-                <button type="submit" class="register-button" id="registerBtn">Registrar</button>
+                <button type="submit" class="register-button btn" id="registerBtn">Registrar</button>
             </form>
             <button class="btn" id="showLoginBtn">Voltar para Login</button>
         </div>
     </div>
 
-    <div id="custom-alert" class="custom-alert-hidden">
-        <div class="custom-alert-content">
-            <p id="custom-alert-message"></p>
-            <button id="custom-alert-ok-btn">OK</button>
-        </div>
-    </div>
-
-    <script src="javascript/singForm.js"></script>
+    <script src="javascript/sing.js"></script>
 </body>
 </html>