diff --git a/webring.js b/webring.js
index eccec2a..d8170f3 100644
--- a/webring.js
+++ b/webring.js
@@ -3,9 +3,14 @@ const JSON_WEBRING = "https://git.gablaxy.xyz/api/v1/repos/gablaxy/webring/raw/w
 const template = document.createElement("template");
 template.innerHTML = `
 <style>
+:root{
+    --webring-texte: #c296f5;
+    --webring-links: #9162c7;
+}
+
 #webring-container{
     margin-top: 10px;
-    border: 1px solid #9162c7;
+    border: 1px solid var(--webring-links);
     border-radius: 5px;
     padding: 5px;
     display: inline-flex;
@@ -13,28 +18,33 @@ template.innerHTML = `
 }
 
 #webring-title{
-    font-family: Title;
-    color: #c296f5;
+    color: var(--webring-texte);
     margin-top: 0;
     margin-bottom: 3px;
     padding: 0 5px;
     font-size: 1.2em;
     text-align: center;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+#webring-title .spacer {
+  width: 1em;
 }
 
 #webring-inner a{
-    color: #9162c7;
+    color: var(--webring-links);
     text-decoration: none;
     padding: 0 5px;
 }
 
 #webring-inner a:hover{
-    color: #c296f5;
+    color: var(--webring-texte);
 }
 
 #webring-inner{
-    font-family: FreePixel;
-    color: #c296f5;
+    color: var(--webring-texte);
     padding: 0 5px;
 }
 </style>
@@ -66,7 +76,7 @@ class Webring extends HTMLElement {
 
                 if (matchedSiteIndex === -1) {
                     this.shadowRoot.querySelector("#webring-inner").insertAdjacentHTML("afterbegin", `
-                        <h3 id="webring-title">grossomodo</h3>
+                        <h3 id="webring-title"><span class="spacer"></span><span>grossomodo</span><a class="hub" href="https://hub.gablaxy.xyz/">X</a></h3>
                         <p>T'es pas dans le gang bozo</p>
                     `);
                     return;
@@ -79,7 +89,7 @@ class Webring extends HTMLElement {
                 if (nextSiteIndex >= sites.length) nextSiteIndex = 0;
 
                 const content = `
-                    <h3 id="webring-title">grossomodo</h3>
+                    <h3 id="webring-title"><span class="spacer"></span><span>grossomodo</span><a class="hub" href="https://hub.gablaxy.xyz/">X</a></h3>
                     <a href="${sites[previousSiteIndex].url}" rel="prev noreferrer external">&lt; avant</a>
                     /   
                     <a rel="external noreferrer" href="${sites[matchedSiteIndex].url}">${sites[matchedSiteIndex].name}</a>
@@ -94,7 +104,7 @@ class Webring extends HTMLElement {
             .catch((error) => {
                 console.error(error);
                 const content = `
-                <h3 id="webring-title">grossomodo</h3>
+                <h3 id="webring-title"><span class="spacer"></span><span>grossomodo</span><a class="hub" href="https://hub.gablaxy.xyz/">X</a></h3>
                 <p>T'es pas dans le gang bozo</p>
                 `;
                 
@@ -105,4 +115,4 @@ class Webring extends HTMLElement {
     }
 }
 
-window.customElements.define("webring-iutechno", Webring);
\ No newline at end of file
+window.customElements.define("webring-iutechno", Webring);