diff --git a/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor b/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor
index b54a215..9310bc1 100644
--- a/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor
+++ b/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor
@@ -8,19 +8,18 @@
 
 
 <Bar Breakpoint="Breakpoint.Desktop"
-     Background="Background.Light"
-     ThemeContrast="ThemeContrast.Light">
+     class="bar-container">
     <BarBrand>
-        VeraxShield
+        <img class="logo" src="/ressources/images/logo/logo.png" Text="Logo de Verax" Fluid />
     </BarBrand>
     <BarToggler />
     <BarMenu>
         <BarStart>
             <BarItem>
-                <BarLink To="#home">Utilisateurs</BarLink>
+                <BarLink @onclick="@NavUtilisateurs">Utilisateurs</BarLink>
             </BarItem>
             <BarItem>
-                <BarLink To="#docs">Articles</BarLink>
+                <BarLink @onclick="@NavArticles">Articles</BarLink>
                 @* <BarDropdown>
                     <BarDropdownToggle>Dropdown</BarDropdownToggle>
                     <BarDropdownMenu>
@@ -31,7 +30,7 @@
                 </BarDropdown> *@
             </BarItem>
             <BarItem>
-                <BarLink To="#docs">Modérateurs</BarLink>
+                <BarLink @onclick="@NavModerateurs">Modérateurs</BarLink>
             </BarItem>
         </BarStart>
         <BarBrand>
diff --git a/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor.cs b/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor.cs
index 3bb07df..7784179 100644
--- a/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor.cs
+++ b/VeraxShield/VeraxShield/composants/affichages/navBar/NavBarPrincipale.razor.cs
@@ -1,7 +1,26 @@
-namespace VeraxShield.composants.affichages.navBar
+using Microsoft.AspNetCore.Components;
+
+namespace VeraxShield.composants.affichages.navBar
 {
     public partial class NavBarPrincipale
     {
 
+        [Inject]
+        private NavigationManager NavigationManager { get; set; }
+
+        private async Task NavUtilisateurs()
+        {
+            NavigationManager.NavigateTo("/utilisateurs/liste");
+        }
+
+        private async Task NavArticles()
+        {
+            NavigationManager.NavigateTo("/articles/liste");
+        }
+
+        private async Task NavModerateurs()
+        {
+            NavigationManager.NavigateTo("/utilisateurs/liste");
+        }
     }
 }
diff --git a/VeraxShield/VeraxShield/wwwroot/css/composants/navBar/NavBarPrincipale.css b/VeraxShield/VeraxShield/wwwroot/css/composants/navBar/NavBarPrincipale.css
index 7fba97a..f390ac2 100644
--- a/VeraxShield/VeraxShield/wwwroot/css/composants/navBar/NavBarPrincipale.css
+++ b/VeraxShield/VeraxShield/wwwroot/css/composants/navBar/NavBarPrincipale.css
@@ -1,3 +1,13 @@
-body {
-    
+body{
+    color : snow;
 }
+
+.bar-container{
+    background-color : black;
+}
+
+.logo{
+    width : 80px;
+}
+
+
diff --git a/VeraxShield/VeraxShield/wwwroot/ressources/images/logo/logo.png b/VeraxShield/VeraxShield/wwwroot/ressources/images/logo/logo.png
new file mode 100644
index 0000000..2f38be0
Binary files /dev/null and b/VeraxShield/VeraxShield/wwwroot/ressources/images/logo/logo.png differ