diff --git a/index.html b/index.html
index ea8cc2f..bed6e6a 100644
--- a/index.html
+++ b/index.html
@@ -284,6 +284,10 @@ <h1 style="color: white">MUD Colorizer</h1>
           &nbsp;&nbsp;
           <input type="checkbox" id="invertGradient" />
           <label for="invertGradient">Invert</label>
+          &nbsp;&nbsp;
+          <button id="prevGradientButton" style="background-color: #111; color: white; border: 1px solid #444; padding: 5px 10px; font-family: inherit; cursor: pointer;">Prev</button>
+          &nbsp;
+          <button id="nextGradientButton" style="background-color: #111; color: white; border: 1px solid #444; padding: 5px 10px; font-family: inherit; cursor: pointer;">Next</button>
         </div>
         <br />
 
@@ -2238,6 +2242,23 @@ <h3>Custom Gradients</h3>
       document.getElementById("patternSelect").addEventListener("change", onPatternChange);
       document.getElementById("invertGradient").addEventListener("change", onGradientChange);
       
+      // Next/Prev Gradient Buttons
+      document.getElementById("prevGradientButton").addEventListener("click", function() {
+        const select = document.getElementById("gradientSelect");
+        if (select.selectedIndex > 0) {
+          select.selectedIndex--;
+          onGradientChange();
+        }
+      });
+      
+      document.getElementById("nextGradientButton").addEventListener("click", function() {
+        const select = document.getElementById("gradientSelect");
+        if (select.selectedIndex < select.options.length - 1) {
+          select.selectedIndex++;
+          onGradientChange();
+        }
+      });
+      
       // Format conversion event
       document.getElementById("formatSelector").addEventListener("change", function () {
         console.log("Format selector changed to:", this.value);