diff --git a/src/settings.py b/src/settings.py
index 2eb7e04..edfc9e4 100644
--- a/src/settings.py
+++ b/src/settings.py
@@ -76,6 +76,7 @@ class Settings(dict):
                 elif key == "color_order":
                     if value == "rbg": self.color_order = (1, 5, 3)
                     else: self.color_order = (1, 3, 5)
+                    pass
                 elif key == "id":
                     pass
                 elif key == "led_pin":
diff --git a/src/static/main.css b/src/static/main.css
index d321d13..15226a5 100644
--- a/src/static/main.css
+++ b/src/static/main.css
@@ -98,3 +98,12 @@ input[type="range"]::-moz-range-thumb {
 #connection-status.closed {
     background-color: red;
 }
+
+#color_order_form label,
+#color_order_form input[type="radio"] {
+    /* Ensures they behave as inline elements */
+    display: inline-block;
+    /* Adds some space between them for readability */
+    margin-right: 10px;
+    vertical-align: middle; /* Aligns them nicely if heights vary */
+}
diff --git a/src/static/main.js b/src/static/main.js
index 3a1f6cb..9e00994 100644
--- a/src/static/main.js
+++ b/src/static/main.js
@@ -162,6 +162,18 @@ async function updateLedPin(event) {
   sendWebSocketData({ led_pin: parseInt(ledpin) });
 }
 
+function handleRadioChange(event) {
+  event.preventDefault();
+  console.log("Selected color order:", event.target.value);
+  // Add your specific logic here
+  if (event.target.value === "rgb") {
+    console.log("RGB order selected!");
+  } else if (event.target.value === "rbg") {
+    console.log("RBG order selected!");
+  }
+  sendWebSocketData({ color_order: event.target.value });
+}
+
 function createPatternButtons(patterns) {
   const container = document.getElementById("pattern_buttons");
   container.innerHTML = ""; // Clear previous buttons
@@ -205,6 +217,8 @@ document.addEventListener("DOMContentLoaded", async function () {
     .getElementById("brightness")
     .addEventListener("touchend", updateBrightness);
 
+  document.getElementById("rgb").addEventListener("change", handleRadioChange);
+  document.getElementById("rbg").addEventListener("change", handleRadioChange);
   document.querySelectorAll(".pattern_button").forEach((button) => {
     console.log(button.value);
     button.addEventListener("click", async (event) => {
diff --git a/src/templates/index.html b/src/templates/index.html
index d107f38..4e1a112 100644
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -110,6 +110,13 @@
                 />
                 <input type="submit" value="Update Led Pin" />
             </form>
+            <form id="color_order_form">
+                <label for="rgb">RGB:</label>
+                <input type="radio" id="rgb" name="color_order" value="rgb" {{'checked' if settings["color_order"]=="rgb" else ''}} />
+                <label for="rbg">RBG</label>
+                <input type="radio" id="rbg" name="color_order" value="rbg" {{'checked' if settings["color_order"]=="rbg" else ''}}/>
+            </form>
+
             <p>Mac address: {{mac}}</p>
         </div>
         <div id="connection-status"></div>