diff --git a/inc/modal.html b/inc/modal.html
index 62d98fc..e0a65b7 100644
--- a/inc/modal.html
+++ b/inc/modal.html
@@ -17,8 +17,8 @@ <h1 class="modal-title fs-5" id="exampleModalLabel">Modal title</h1>
         Body modal
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
-        <button type="button" class="btn btn-secondary">Save changes</button>
+        <button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-primary">Save changes</button>
       </div>
     </div>
   </div>
diff --git a/inc/offcanvas.html b/inc/offcanvas.html
index 45119b0..5f197f8 100644
--- a/inc/offcanvas.html
+++ b/inc/offcanvas.html
@@ -16,7 +16,7 @@ <h5 class="offcanvas-title" id="offcanvasExampleLabel">Offcanvas</h5>
       Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.
     </div>
     <div class="dropdown mt-3">
-      <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown">
+      <button class="btn btn-outline-primary dropdown-toggle" type="button" data-bs-toggle="dropdown">
         Dropdown button
       </button>
       <ul class="dropdown-menu">
diff --git a/index.html b/index.html
index fc7d411..72351d8 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="description" content="An alternative simple and elegant Bootstrap way!" />
   <meta name="author" content="Marco Gargano" />
-  <meta name="generator" content="Hugo 0.122.0" />
   <title>Simplify Bootstrap - v. 0.1</title>
   <link rel="stylesheet" href="style.css" />
 </head>
@@ -23,7 +22,8 @@ <h5>Semplice ed elegante abito sartoriale. </h5>
         <div class="col-9">
           <h4>👋 Ciao! Mi chiamo Marco, <br />sono appassionato di front-end e utilizzo Bootstrap da tanti anni.</h4>
           <p class="mb-1">Ritengo che Bootstrap sia un <strong>framework CSS completo</strong> e sopratutto
-            <strong>pronto all'uso</strong>.</p>
+            <strong>pronto all'uso</strong>.
+          </p>
           <p class="mb-5">Oltre che per progetti personali di piccole dimensioni, utilizzo Bootstrap anche in ambienti
             lavorativi più strutturati; talvolta viene compilato e spesso viene utilizzata una CDN.</p>
 
@@ -71,44 +71,64 @@ <h4>☝️ Il mio approccio!</h4>
 
       <div class="row g-5">
         <div class="col-md-2">
-          <ul class="list ps-3 py-3 sticky-top">
-            <li>
-              <a class="icon-link mb-1" href="#s-button">Button</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-badge">Badge</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-dropdown">Dropdown</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-nav">Nav</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-navbar">Navbar</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-tab">Tab</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-modal">Modal</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-offcanvas">Offcanvas</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-accordion">Accordion</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-alert">Alert</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-table">Table</a>
-            </li>
-            <li>
-              <a class="icon-link mb-1" href="#s-form">Form</a>
-            </li>
-          </ul>
+          <div class="py-3 sticky-top">
+            <ul class="list ps-3">
+              <li>
+                <a class="icon-link mb-1" href="#s-button">Button</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-badge">Badge</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-dropdown">Dropdown</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-nav">Nav</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-navbar">Navbar</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-tab">Tab</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-modal">Modal</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-offcanvas">Offcanvas</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-accordion">Accordion</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-alert">Alert</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-table">Table</a>
+              </li>
+              <li>
+                <a class="icon-link mb-1" href="#s-form">Form</a>
+              </li>
+            </ul>
+
+            <hr class="col-3 my-4" />
+
+            <form class="" method="post" action="">
+              <label class="d-flex align-items-center form-label" for="picker">Change <input type="color" class="float-start form-control form-control-color form-control-sm ms-1" id="picker" value="#9d33e7" /></label>
+            </form>
+
+            <div id="picker-style">
+              <style>
+                :root {
+                  --bs-primary: #9d33e7;
+                  --bs-primary-rgb: 157, 51, 231;
+                  --bs-secondary: #91abc1;
+                  --bs-secondary-rgb: 145, 171, 193;
+                }
+              </style>
+            </div>
+
+          </div>
         </div>
         <div class="col">
           <h2 class="text-body-emphasis">Component example</h2>
@@ -125,8 +145,7 @@ <h2 class="text-body-emphasis">Component example</h2>
         </div>
       </div>
     </main>
-    <footer class="pt-5 my-5 text-body-secondary border-top">Created by Marco Gargano with ☮️ & 💜 &middot; &copy; 2024
-    </footer>
+    <footer class="pt-5 my-5 text-body-secondary border-top">Created by Marco Gargano with ☮️ & 💜 &middot; &copy; 2024</footer>
   </div>
 
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
@@ -135,6 +154,19 @@ <h2 class="text-body-emphasis">Component example</h2>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
   <script>
     $(document).ready(function () {
+
+      $("#picker").on("change", function() {
+        var color = $("#picker").val();
+        var hex = [
+          parseInt(color.substr(-6,2),16),
+          parseInt(color.substr(-4,2),16),
+          parseInt(color.substr(-2),16)
+      ];
+        $("#picker-style").html("<style> :root { --bs-primary: " + color  + "; --bs-primary-rgb: "+hex+"; } </style>");
+      });
+
+
+
       $("#inc-nav").load("inc/nav.html");
       $("#inc-tab").load("inc/tab.html");
       $("#inc-button").load("inc/button.html");