diff --git a/config.toml b/config.toml
index 9acce3e..89c8a19 100644
--- a/config.toml
+++ b/config.toml
@@ -65,13 +65,14 @@ enableRobotsTXT = true
   # You can use this to inject any HTML in the <head> tag.
   # Ideal usecase for this is to import custom js/css or add your analytics snippet
   customHeadHTML = '''
+    <script src="https://cdn.jsdelivr.net/npm/gaugeJS/dist/gauge.min.js"></script>
     <a rel="me" href="https://mastodon.social/@ozk">Mastodon</a>
     <link rel="stylesheet" type="text/css" href="/css/ozk.css">
   '''
 
   # License
   licenseName = "BeerWare (rev.42) 🍺"
-  licenseDescription = " N'hésitez pas à nous payer une bière si vous le voulez quand vous nous croisez !"
+  licenseDescription = "N'hésitez pas à nous payer une bière si vous le voulez quand vous nous croisez ! {{< gauge url="https://cloud.richoux.me/seafhttp/f/2582b44ba453453f8793/?op=view" >}}'"
   
   showPostsOnHomePage = "future"
 
diff --git a/layouts/shortcodes/gauge.html b/layouts/shortcodes/gauge.html
new file mode 100644
index 0000000..e00df6e
--- /dev/null
+++ b/layouts/shortcodes/gauge.html
@@ -0,0 +1,59 @@
+<!-- layouts/shortcodes/gauge.html -->
+<div class="gauge-small" style="width:120px; height:60px; position:relative;">
+  <canvas id="gauge-canvas-small"></canvas>
+  <div id="gauge-value-small" style="
+    position:absolute;
+    bottom:4px; left:50%;
+    transform:translateX(-50%);
+    font-size:0.8rem;
+    background:rgba(255,255,255,0.8);
+    padding:2px 6px;
+    border-radius:4px;
+    pointer-events:none;
+  ">…</div>
+</div>
+<script>
+  (function(){
+    const opts = {
+      angle: 0.15,
+      lineWidth: 0.44,
+      radiusScale: 1,
+      pointer: { length: 0.6, strokeWidth: 0.035, color: '#000' },
+      limitMax: false, limitMin: false,
+      colorStart: '#4caf50', colorStop: '#4caf50',
+      strokeColor: '#EEEEEE',
+      generateGradient: false,
+      highDpiSupport: true
+    };
+    const canvas = document.getElementById('gauge-canvas-small');
+    const container = canvas.parentElement;
+    const dpr = window.devicePixelRatio || 1;
+    const { width, height } = container.getBoundingClientRect();
+    canvas.width = width * dpr;
+    canvas.height = height * dpr;
+    canvas.style.width  = width + 'px';
+    canvas.style.height = height + 'px';
+    const gauge = new Gauge(canvas).setOptions(opts);
+    gauge.maxValue = 100;
+    gauge.setMinValue(0);
+    gauge.animationSpeed = 32;
+    async function updateSmall(){
+      try {
+        const res = await fetch('{{ .Get "url" }}', {cache:'no-store'});
+        if (!res.ok) throw res.status;
+        const pct = Math.max(0, Math.min(100, parseFloat(await res.text())));
+        const color = pct < 20 ? '#f44336' : pct <= 80 ? '#ff9800' : '#4caf50';
+        opts.colorStart = opts.colorStop = color;
+        gauge.setOptions(opts);
+        gauge.set(pct);
+        document.getElementById('gauge-value-small').textContent = pct.toFixed(0)+'%';
+      } catch(e) {
+        document.getElementById('gauge-value-small').textContent = 'err';
+        console.error(e);
+      }
+    }
+    updateSmall();
+    setInterval(updateSmall, 30000);
+  })();
+</script>
+
