diff --git a/client/src/main.jsx b/client/src/main.jsx
index c2af0306..8d1058ce 100644
--- a/client/src/main.jsx
+++ b/client/src/main.jsx
@@ -8,6 +8,9 @@ const createSocket = require('./socket');
 
 const StatusContainer = require('./components/status.container');
 
+{/*-- Section for html render classes --*/}
+const Navbar = require('./navbar');
+
 const store = createStore(
     combineReducers({
         account: reducers.accountReducer,
@@ -18,11 +21,14 @@ const ws = createSocket(store);
 
 store.subscribe(() => console.log(store.getState()));
 
+
 const Cryps = () => (
     <section>
+        <Navbar />
         <div id="fizzytext" />
         <StatusContainer />
     </section>
+
 );
 
 const Main = () => (
@@ -34,3 +40,4 @@ const Main = () => (
 preact.render(<Main />, document.body);
 
 fizzyText('cryps');
+
diff --git a/client/src/navbar.jsx b/client/src/navbar.jsx
new file mode 100644
index 00000000..0a1e80d9
--- /dev/null
+++ b/client/src/navbar.jsx
@@ -0,0 +1,39 @@
+const preact = require('preact');
+const jdenticon = require('jdenticon');
+
+{/*Test to render navbar and some identicons*/}
+const Navbar = () => (
+  <div> 
+    <nav class="navbar"> 
+      <div class="navbar-end"> 
+        <a class="navbar-item is-active"> 
+          Home 
+        </a> 
+        <a class="navbar-item"> 
+          Store 
+        </a> 
+        <a class="navbar-item"> 
+          FAQ 
+        </a> 
+        <span class="navbar-item"> 
+          <a class="button is-info is-inverted"> 
+            <span class="icon"> 
+              <svg width="80" height="80" data-jdenticon-value="Blog"></svg>
+            </span> 
+            <span>Blog</span> 
+          </a> 
+        </span> 
+      </div> 
+    </nav>
+    <span>
+      Mashy ->
+      <svg width="80" height="80" data-jdenticon-value="Mashy"></svg>
+    </span>
+    <span>
+      Ntr ->
+      <svg width="80" height="80" data-jdenticon-value="Ntr"></svg>
+    </span>
+  </div>
+);
+
+module.exports = Navbar;
\ No newline at end of file