From 6f69bee7ccca2e634881d07985abd67997e9fa52 Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Thu, 29 Jan 2026 19:25:58 +0100
Subject: [PATCH 1/6] improved readability of lettings_leds.htm

---
 wled00/data/settings_leds.htm | 260 ++++++++++++++++++----------------
 wled00/data/style.css         |   9 +-
 2 files changed, 146 insertions(+), 123 deletions(-)

diff --git a/wled00/data/settings_leds.htm b/wled00/data/settings_leds.htm
index da2867957b..7ed5b4e7d8 100644
--- a/wled00/data/settings_leds.htm
+++ b/wled00/data/settings_leds.htm
@@ -875,136 +875,152 @@
 		<div class="helpB"><button type="button" onclick="H('features/settings/#led-settings')">?</button></div>
 		<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
 		</div>
-		<h2>LED &amp; Hardware setup</h2>
-		Total LEDs: <span id="lc">?</span> <span id="pc"></span><br>
-		<i>Recommended power supply for brightest white:</i><br>
-		<b><span id="psu">?</span></b><br>
-		<span id="psu2"><br></span>
-		<br>
-		Enable automatic brightness limiter: <input type="checkbox" name="ABL" onchange="enABL()"><br>
-		<div id="abl">
-			<i>Automatically limits brightness to stay close to the limit.<br>
-				Keep at &lt;1A if powering LEDs directly from the ESP 5V pin!<br>
-				If using multiple outputs it is recommended to use per-output limiter.<br>
-				Analog (PWM) and virtual LEDs cannot use automatic brightness limiter.<br></i>
-			<div id="psuMA">Maximum PSU Current: <input name="MA" type="number" class="xl" min="250" max="65000" oninput="UI()" required> mA<br></div>
-			Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br>
-			<div id="ppldis" style="display:none;">
-				<i>Make sure you enter correct value for each LED output.<br>
-				If using multiple outputs with only one PSU, distribute its power proportionally amongst outputs.</i><br>
+		<h2>Hardware setup</h2>
+		<div class="sec">
+			<h3>LED setup</h3>
+			Total LEDs: <span id="lc">?</span> <span id="pc"></span><br>
+			<i>Recommended power supply for brightest white:</i><br>
+			<b><span id="psu">?</span></b><br>
+			<span id="psu2"><br></span>
+			<br>
+			Enable automatic brightness limiter: <input type="checkbox" name="ABL" onchange="enABL()"><br>
+			<div id="abl">
+				<i>Automatically limits brightness to stay close to the limit.<br>
+					Keep at &lt;1A if powering LEDs directly from the ESP 5V pin!<br>
+					If using multiple outputs it is recommended to use per-output limiter.<br>
+					Analog (PWM) and virtual LEDs cannot use automatic brightness limiter.<br></i>
+				<div id="psuMA">Maximum PSU Current: <input name="MA" type="number" class="xl" min="250" max="65000" oninput="UI()" required> mA<br></div>
+				Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br>
+				<div id="ppldis" style="display:none;">
+					<i>Make sure you enter correct value for each LED output.<br>
+					If using multiple outputs with only one PSU, distribute its power proportionally amongst outputs.</i><br>
+				</div>
+				<div id="ampwarning" class="warn" style="display: none;">
+					&#9888; Your power supply provides high current.<br>
+					To improve the safety of your setup,<br>
+					please use thick cables,<br>
+					multiple power injection points and a fuse!<br>
+				</div>
 			</div>
-			<div id="ampwarning" class="warn" style="display: none;">
-				&#9888; Your power supply provides high current.<br>
-				To improve the safety of your setup,<br>
-				please use thick cables,<br>
-				multiple power injection points and a fuse!<br>
+			<div id="mLC">LED outputs:</div>
+			<hr class="sml">
+			<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
+			<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
+			LED memory usage: <span id="m0">0</span> / <span id="m1">?</span> B<br>
+			<div id="dbar" style="display:inline-block; width: 100px; height: 10px; border-radius: 20px;"></div><br>
+			<div id="ledwarning" class="warn" style="display: none;">
+				&#9888; You might run into stability or lag issues.<br>
+				Use less than <span id="wreason">800 LEDs per output</span> for the best experience!<br>
+			</div>
+			<hr class="sml">
+			<div id="prl" class="hide">Use parallel I2S: <input type="checkbox" name="PR"><br></div>
+			Make a segment for each output: <input type="checkbox" name="MS"><br>
+			Custom bus start indices: <input type="checkbox" onchange="tglSi(this.checked)" id="si"><br>
+			<hr class="sml">
+			<div id="color_order_mapping">
+				Color Order Override:
+				<div id="com_entries"></div>
+				<hr class="sml">
+				<button type="button" id="com_add" onclick="addCOM()">+</button>
+				<button type="button" id="com_rem" onclick="remCOM()">-</button>
 			</div>
 		</div>
-		<h3>Hardware setup</h3>
-		<div id="mLC">LED outputs:</div>
-		<hr class="sml">
-		<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
-		<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
-		LED memory usage: <span id="m0">0</span> / <span id="m1">?</span> B<br>
-		<div id="dbar" style="display:inline-block; width: 100px; height: 10px; border-radius: 20px;"></div><br>
-		<div id="ledwarning" class="warn" style="display: none;">
-			&#9888; You might run into stability or lag issues.<br>
-			Use less than <span id="wreason">800 LEDs per output</span> for the best experience!<br>
+		<div class="sec">
+			<h3>Buttons</h3>
+			<div id="btn_wrap">
+				<div id="btns"></div>
+				<hr class="sml">
+				<button type="button" id="btn_add" onclick="addBtn(gId('btns').children.length,-1,0)">+</button>
+				<button type="button" id="btn_rem" onclick="remBtn()">-</button>
+			</div>
+			Disable internal pull-up/down: <input type="checkbox" name="IP"><br>
+			Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
 		</div>
-		<hr class="sml">
-		<div id="prl" class="hide">Use parallel I2S: <input type="checkbox" name="PR"><br></div>
-		Make a segment for each output: <input type="checkbox" name="MS"><br>
-		Custom bus start indices: <input type="checkbox" onchange="tglSi(this.checked)" id="si"><br>
-		<hr class="sml">
-		<div id="color_order_mapping">
-			Color Order Override:
-			<div id="com_entries"></div>
-			<hr class="sml">
-			<button type="button" id="com_add" onclick="addCOM()">+</button>
-			<button type="button" id="com_rem" onclick="remCOM()">-</button>
+		<div class="sec">
+			<h3>IR Remote</h3>
+			IR GPIO: <input type="number" min="-1" max="48" name="IR" onchange="UI()" class="xs"><select name="IT" onchange="UI()">
+			<option value=0>Remote disabled</option>
+			<option value=1>24-key RGB</option>
+			<option value=2>24-key with CT</option>
+			<option value=3>40-key blue</option>
+			<option value=4>44-key RGB</option>
+			<option value=5>21-key RGB</option>
+			<option value=6>6-key black</option>
+			<option value=7>9-key red</option>
+			<option value=8>JSON remote</option>
+			</select><span style="cursor: pointer;" onclick="off('IR')">&nbsp;&#x2715;</span><br>
+			Apply IR change to main segment only: <input type="checkbox" name="MSO"><br>
+			<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/ir.json')">Upload</button><br></div>
+			<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
 		</div>
-		<hr class="sml">
-		<div id="btn_wrap">
-			Buttons:
-			<div id="btns"></div>
-			<hr class="sml">
-			<button type="button" id="btn_add" onclick="addBtn(gId('btns').children.length,-1,0)">+</button>
-			<button type="button" id="btn_rem" onclick="remBtn()">-</button>
+		<div class="sec">
+			<h3>Relay</h3>
+			Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
+			Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br>
+		</div>
+		<h2>General settings</h2>
+		<div class="sec">
+			<h3>Defaults</h3>
+			Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
+			Default brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br><br>
+			Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 uses values from above)<br><br>
+			Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
+			Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
+			Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
+			Brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %
 		</div>
-		Disable internal pull-up/down: <input type="checkbox" name="IP"><br>
-		Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
-		<hr class="sml">
-		IR GPIO: <input type="number" min="-1" max="48" name="IR" onchange="UI()" class="xs"><select name="IT" onchange="UI()">
-		<option value=0>Remote disabled</option>
-		<option value=1>24-key RGB</option>
-		<option value=2>24-key with CT</option>
-		<option value=3>40-key blue</option>
-		<option value=4>44-key RGB</option>
-		<option value=5>21-key RGB</option>
-		<option value=6>6-key black</option>
-		<option value=7>9-key red</option>
-		<option value=8>JSON remote</option>
-		</select><span style="cursor: pointer;" onclick="off('IR')">&nbsp;&#x2715;</span><br>
-		Apply IR change to main segment only: <input type="checkbox" name="MSO"><br>
-		<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/ir.json')">Upload</button><br></div>
-		<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
-		<hr class="sml">
-		Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
-		Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br>
-		<hr class="sml">
-		<h3>Defaults</h3>
-		Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
-		Default brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br><br>
-		Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 uses values from above)<br><br>
-		Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
-		Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
-		Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
-		Brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %
-		<h3>Transitions</h3>
-		Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br>
-		<i>Random Cycle</i> Palette Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br>
-		<h3>Timed light</h3>
-		Default duration: <input name="TL" type="number" class="m" min="1" max="255" required> min<br>
-		Default target brightness: <input name="TB" type="number" class="m" min="0" max="255" required><br>
-		Mode:
-		<select name="TW">
-			<option value="0">Wait and set</option>
-			<option value="1">Fade</option>
-			<option value="2">Fade Color</option>
-			<option value="3">Sunrise</option>
-		</select>
-		<h3>White management</h3>
-		White Balance correction: <input type="checkbox" name="CCT"><br>
-		<div id="wc">
-			Global override for Auto-calculate white:<br>
-			<select name="AW">
-				<option value=255>Disabled</option>
-				<option value=0>None</option>
-				<option value=1>Brighter</option>
-				<option value=2>Accurate</option>
-				<option value=3>Dual</option>
-				<option value=4>Max</option>
+		<div class="sec">
+			<h3>Transitions</h3>
+			Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br>
+			<i>Random Cycle</i> Palette Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br>
+		</div>
+		<div class="sec">
+			<h3>Timed light</h3>
+			Default duration: <input name="TL" type="number" class="m" min="1" max="255" required> min<br>
+			Default target brightness: <input name="TB" type="number" class="m" min="0" max="255" required><br>
+			Mode:
+			<select name="TW">
+				<option value="0">Wait and set</option>
+				<option value="1">Fade</option>
+				<option value="2">Fade Color</option>
+				<option value="3">Sunrise</option>
 			</select>
-			<br>
-			Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
-			CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
-			CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
-			<i class="warn">WARNING: When using H-bridge for reverse polarity (2-wire) CCT LED strip<br><b>make sure this value is 0</b>.<br>(ESP32 variants only, ESP8266 does not support H-bridges)</i>
 		</div>
-		<h3>Advanced</h3>
-		Palette wrapping:
-		<select name="PB">
-			<option value="0">Linear (wrap if moving)</option>
-			<option value="1">Linear (always wrap)</option>
-			<option value="2">Linear (never wrap)</option>
-			<option value="3">None (not recommended)</option>
-		</select><br>
-		Use harmonic <i>Random Cycle</i> palette: <input type="checkbox" name="TH"><br>
-		Target refresh rate: <input type="number" class="s" min="0" max="250" name="FR" oninput="UI()" required> FPS
-		<div id="fpsNone" class="warn" style="display: none;">&#9888; Unlimited FPS Mode is experimental &#9888;<br></div>
-		<div id="fpsHigh" class="warn" style="display: none;">&#9888; High FPS Mode is experimental.<br></div>
-		<div id="fpsWarn" class="warn" style="display: none;">Please <a class="lnk" href="sec#backup">backup</a> WLED configuration and presets first!<br></div>
-		<hr class="sml">
+		<div class="sec">
+			<h3>White management</h3>
+			White Balance correction: <input type="checkbox" name="CCT"><br>
+			<div id="wc">
+				Global override for Auto-calculate white:<br>
+				<select name="AW">
+					<option value=255>Disabled</option>
+					<option value=0>None</option>
+					<option value=1>Brighter</option>
+					<option value=2>Accurate</option>
+					<option value=3>Dual</option>
+					<option value=4>Max</option>
+				</select>
+				<br>
+				Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
+				CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
+				CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
+				<i class="warn">WARNING: When using H-bridge for reverse polarity (2-wire) CCT LED strip<br><b>make sure this value is 0</b>.<br>(ESP32 variants only, ESP8266 does not support H-bridges)</i>
+			</div>
+		</div>
+		<div class="sec">
+			<h3>Advanced</h3>
+			Palette wrapping:
+			<select name="PB">
+				<option value="0">Linear (wrap if moving)</option>
+				<option value="1">Linear (always wrap)</option>
+				<option value="2">Linear (never wrap)</option>
+				<option value="3">None (not recommended)</option>
+			</select><br>
+			Use harmonic <i>Random Cycle</i> palette: <input type="checkbox" name="TH"><br>
+			Target refresh rate: <input type="number" class="s" min="0" max="250" name="FR" oninput="UI()" required> FPS
+			<div id="fpsNone" class="warn" style="display: none;">&#9888; Unlimited FPS Mode is experimental &#9888;<br></div>
+			<div id="fpsHigh" class="warn" style="display: none;">&#9888; High FPS Mode is experimental.<br></div>
+			<div id="fpsWarn" class="warn" style="display: none;">Please <a class="lnk" href="sec#backup">backup</a> WLED configuration and presets first!<br></div>
+		</div>
 		<div id="cfg">Config template: <input type="file" name="data2" accept=".json"><button type="button" class="sml" onclick="loadCfg(d.Sf.data2)">Apply</button><br></div>
 		<hr>
 		<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
diff --git a/wled00/data/style.css b/wled00/data/style.css
index 059b8a5be6..b0e9f67c8b 100644
--- a/wled00/data/style.css
+++ b/wled00/data/style.css
@@ -5,7 +5,7 @@ body {
   font-family: Verdana, sans-serif;
   font-size: 1rem;
   text-align: center;
-  background: #222;
+  background: #000;
   color: #fff;
   line-height: 200%;
   margin: 0;
@@ -23,6 +23,13 @@ a, a:hover {
   color: #28f;
   text-decoration: none;
 }
+.sec {
+  background: #222;
+  border-radius: 20px;
+  padding: 8px;
+  margin: 12px auto;
+  max-width: 520px;
+}
 button, .btn {
   background: #333;
   color: #fff;

From 055c55b156318c30b8ce61184ca7cd77da67c59c Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Fri, 30 Jan 2026 08:04:12 +0100
Subject: [PATCH 2/6] left shifted indentation to preserve "blame" history but
 still have indentation

---
 wled00/data/settings_leds.htm | 296 +++++++++++++++++-----------------
 1 file changed, 148 insertions(+), 148 deletions(-)

diff --git a/wled00/data/settings_leds.htm b/wled00/data/settings_leds.htm
index 7ed5b4e7d8..4b6d76ea39 100644
--- a/wled00/data/settings_leds.htm
+++ b/wled00/data/settings_leds.htm
@@ -870,161 +870,161 @@
 	</script>
 </head>
 <body>
-	<form id="form_s" name="Sf" method="post">
-		<div class="toprow">
-		<div class="helpB"><button type="button" onclick="H('features/settings/#led-settings')">?</button></div>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
-		</div>
-		<h2>Hardware setup</h2>
-		<div class="sec">
-			<h3>LED setup</h3>
-			Total LEDs: <span id="lc">?</span> <span id="pc"></span><br>
-			<i>Recommended power supply for brightest white:</i><br>
-			<b><span id="psu">?</span></b><br>
-			<span id="psu2"><br></span>
-			<br>
-			Enable automatic brightness limiter: <input type="checkbox" name="ABL" onchange="enABL()"><br>
-			<div id="abl">
-				<i>Automatically limits brightness to stay close to the limit.<br>
-					Keep at &lt;1A if powering LEDs directly from the ESP 5V pin!<br>
-					If using multiple outputs it is recommended to use per-output limiter.<br>
-					Analog (PWM) and virtual LEDs cannot use automatic brightness limiter.<br></i>
-				<div id="psuMA">Maximum PSU Current: <input name="MA" type="number" class="xl" min="250" max="65000" oninput="UI()" required> mA<br></div>
-				Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br>
-				<div id="ppldis" style="display:none;">
-					<i>Make sure you enter correct value for each LED output.<br>
-					If using multiple outputs with only one PSU, distribute its power proportionally amongst outputs.</i><br>
-				</div>
-				<div id="ampwarning" class="warn" style="display: none;">
-					&#9888; Your power supply provides high current.<br>
-					To improve the safety of your setup,<br>
-					please use thick cables,<br>
-					multiple power injection points and a fuse!<br>
-				</div>
-			</div>
-			<div id="mLC">LED outputs:</div>
-			<hr class="sml">
-			<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
-			<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
-			LED memory usage: <span id="m0">0</span> / <span id="m1">?</span> B<br>
-			<div id="dbar" style="display:inline-block; width: 100px; height: 10px; border-radius: 20px;"></div><br>
-			<div id="ledwarning" class="warn" style="display: none;">
-				&#9888; You might run into stability or lag issues.<br>
-				Use less than <span id="wreason">800 LEDs per output</span> for the best experience!<br>
+<form id="form_s" name="Sf" method="post">
+	<div class="toprow">
+	<div class="helpB"><button type="button" onclick="H('features/settings/#led-settings')">?</button></div>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
+	</div>
+	<h2>Hardware setup</h2>
+	<div class="sec">
+		<h3>LED setup</h3>
+		Total LEDs: <span id="lc">?</span> <span id="pc"></span><br>
+		<i>Recommended power supply for brightest white:</i><br>
+		<b><span id="psu">?</span></b><br>
+		<span id="psu2"><br></span>
+		<br>
+		Enable automatic brightness limiter: <input type="checkbox" name="ABL" onchange="enABL()"><br>
+		<div id="abl">
+			<i>Automatically limits brightness to stay close to the limit.<br>
+				Keep at &lt;1A if powering LEDs directly from the ESP 5V pin!<br>
+				If using multiple outputs it is recommended to use per-output limiter.<br>
+				Analog (PWM) and virtual LEDs cannot use automatic brightness limiter.<br></i>
+			<div id="psuMA">Maximum PSU Current: <input name="MA" type="number" class="xl" min="250" max="65000" oninput="UI()" required> mA<br></div>
+			Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br>
+			<div id="ppldis" style="display:none;">
+				<i>Make sure you enter correct value for each LED output.<br>
+				If using multiple outputs with only one PSU, distribute its power proportionally amongst outputs.</i><br>
 			</div>
-			<hr class="sml">
-			<div id="prl" class="hide">Use parallel I2S: <input type="checkbox" name="PR"><br></div>
-			Make a segment for each output: <input type="checkbox" name="MS"><br>
-			Custom bus start indices: <input type="checkbox" onchange="tglSi(this.checked)" id="si"><br>
-			<hr class="sml">
-			<div id="color_order_mapping">
-				Color Order Override:
-				<div id="com_entries"></div>
-				<hr class="sml">
-				<button type="button" id="com_add" onclick="addCOM()">+</button>
-				<button type="button" id="com_rem" onclick="remCOM()">-</button>
-			</div>
-		</div>
-		<div class="sec">
-			<h3>Buttons</h3>
-			<div id="btn_wrap">
-				<div id="btns"></div>
-				<hr class="sml">
-				<button type="button" id="btn_add" onclick="addBtn(gId('btns').children.length,-1,0)">+</button>
-				<button type="button" id="btn_rem" onclick="remBtn()">-</button>
+			<div id="ampwarning" class="warn" style="display: none;">
+				&#9888; Your power supply provides high current.<br>
+				To improve the safety of your setup,<br>
+				please use thick cables,<br>
+				multiple power injection points and a fuse!<br>
 			</div>
-			Disable internal pull-up/down: <input type="checkbox" name="IP"><br>
-			Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
 		</div>
-		<div class="sec">
-			<h3>IR Remote</h3>
-			IR GPIO: <input type="number" min="-1" max="48" name="IR" onchange="UI()" class="xs"><select name="IT" onchange="UI()">
-			<option value=0>Remote disabled</option>
-			<option value=1>24-key RGB</option>
-			<option value=2>24-key with CT</option>
-			<option value=3>40-key blue</option>
-			<option value=4>44-key RGB</option>
-			<option value=5>21-key RGB</option>
-			<option value=6>6-key black</option>
-			<option value=7>9-key red</option>
-			<option value=8>JSON remote</option>
-			</select><span style="cursor: pointer;" onclick="off('IR')">&nbsp;&#x2715;</span><br>
-			Apply IR change to main segment only: <input type="checkbox" name="MSO"><br>
-			<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/ir.json')">Upload</button><br></div>
-			<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
+		<div id="mLC">LED outputs:</div>
+		<hr class="sml">
+		<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
+		<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
+		LED memory usage: <span id="m0">0</span> / <span id="m1">?</span> B<br>
+		<div id="dbar" style="display:inline-block; width: 100px; height: 10px; border-radius: 20px;"></div><br>
+		<div id="ledwarning" class="warn" style="display: none;">
+			&#9888; You might run into stability or lag issues.<br>
+			Use less than <span id="wreason">800 LEDs per output</span> for the best experience!<br>
 		</div>
-		<div class="sec">
-			<h3>Relay</h3>
-			Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
-			Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br>
-		</div>
-		<h2>General settings</h2>
-		<div class="sec">
-			<h3>Defaults</h3>
-			Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
-			Default brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br><br>
-			Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 uses values from above)<br><br>
-			Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
-			Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
-			Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
-			Brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %
+		<hr class="sml">
+		<div id="prl" class="hide">Use parallel I2S: <input type="checkbox" name="PR"><br></div>
+		Make a segment for each output: <input type="checkbox" name="MS"><br>
+		Custom bus start indices: <input type="checkbox" onchange="tglSi(this.checked)" id="si"><br>
+		<hr class="sml">
+		<div id="color_order_mapping">
+			Color Order Override:
+			<div id="com_entries"></div>
+			<hr class="sml">
+			<button type="button" id="com_add" onclick="addCOM()">+</button>
+			<button type="button" id="com_rem" onclick="remCOM()">-</button>
 		</div>
-		<div class="sec">
-			<h3>Transitions</h3>
-			Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br>
-			<i>Random Cycle</i> Palette Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br>
+	</div>
+	<div class="sec">
+		<h3>Buttons</h3>
+		<div id="btn_wrap">
+			<div id="btns"></div>
+			<hr class="sml">
+			<button type="button" id="btn_add" onclick="addBtn(gId('btns').children.length,-1,0)">+</button>
+			<button type="button" id="btn_rem" onclick="remBtn()">-</button>
 		</div>
-		<div class="sec">
-			<h3>Timed light</h3>
-			Default duration: <input name="TL" type="number" class="m" min="1" max="255" required> min<br>
-			Default target brightness: <input name="TB" type="number" class="m" min="0" max="255" required><br>
-			Mode:
-			<select name="TW">
-				<option value="0">Wait and set</option>
-				<option value="1">Fade</option>
-				<option value="2">Fade Color</option>
-				<option value="3">Sunrise</option>
+		Disable internal pull-up/down: <input type="checkbox" name="IP"><br>
+		Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
+	</div>
+	<div class="sec">
+		<h3>IR Remote</h3>
+		IR GPIO: <input type="number" min="-1" max="48" name="IR" onchange="UI()" class="xs"><select name="IT" onchange="UI()">
+		<option value=0>Remote disabled</option>
+		<option value=1>24-key RGB</option>
+		<option value=2>24-key with CT</option>
+		<option value=3>40-key blue</option>
+		<option value=4>44-key RGB</option>
+		<option value=5>21-key RGB</option>
+		<option value=6>6-key black</option>
+		<option value=7>9-key red</option>
+		<option value=8>JSON remote</option>
+		</select><span style="cursor: pointer;" onclick="off('IR')">&nbsp;&#x2715;</span><br>
+		Apply IR change to main segment only: <input type="checkbox" name="MSO"><br>
+		<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/ir.json')">Upload</button><br></div>
+		<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
+	</div>
+	<div class="sec">
+		<h3>Relay</h3>
+		Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
+		Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br>
+	</div>
+	<h2>General settings</h2>
+	<div class="sec">
+		<h3>Defaults</h3>
+		Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
+		Default brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br><br>
+		Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 uses values from above)<br><br>
+		Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
+		Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
+		Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
+		Brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %
+	</div>
+	<div class="sec">
+		<h3>Transitions</h3>
+		Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br>
+		<i>Random Cycle</i> Palette Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br>
+	</div>
+	<div class="sec">
+		<h3>Timed light</h3>
+		Default duration: <input name="TL" type="number" class="m" min="1" max="255" required> min<br>
+		Default target brightness: <input name="TB" type="number" class="m" min="0" max="255" required><br>
+		Mode:
+		<select name="TW">
+			<option value="0">Wait and set</option>
+			<option value="1">Fade</option>
+			<option value="2">Fade Color</option>
+			<option value="3">Sunrise</option>
+		</select>
+	</div>
+	<div class="sec">
+		<h3>White management</h3>
+		White Balance correction: <input type="checkbox" name="CCT"><br>
+		<div id="wc">
+			Global override for Auto-calculate white:<br>
+			<select name="AW">
+				<option value=255>Disabled</option>
+				<option value=0>None</option>
+				<option value=1>Brighter</option>
+				<option value=2>Accurate</option>
+				<option value=3>Dual</option>
+				<option value=4>Max</option>
 			</select>
+			<br>
+			Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
+			CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
+			CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
+			<i class="warn">WARNING: When using H-bridge for reverse polarity (2-wire) CCT LED strip<br><b>make sure this value is 0</b>.<br>(ESP32 variants only, ESP8266 does not support H-bridges)</i>
 		</div>
-		<div class="sec">
-			<h3>White management</h3>
-			White Balance correction: <input type="checkbox" name="CCT"><br>
-			<div id="wc">
-				Global override for Auto-calculate white:<br>
-				<select name="AW">
-					<option value=255>Disabled</option>
-					<option value=0>None</option>
-					<option value=1>Brighter</option>
-					<option value=2>Accurate</option>
-					<option value=3>Dual</option>
-					<option value=4>Max</option>
-				</select>
-				<br>
-				Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
-				CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
-				CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
-				<i class="warn">WARNING: When using H-bridge for reverse polarity (2-wire) CCT LED strip<br><b>make sure this value is 0</b>.<br>(ESP32 variants only, ESP8266 does not support H-bridges)</i>
-			</div>
-		</div>
-		<div class="sec">
-			<h3>Advanced</h3>
-			Palette wrapping:
-			<select name="PB">
-				<option value="0">Linear (wrap if moving)</option>
-				<option value="1">Linear (always wrap)</option>
-				<option value="2">Linear (never wrap)</option>
-				<option value="3">None (not recommended)</option>
-			</select><br>
-			Use harmonic <i>Random Cycle</i> palette: <input type="checkbox" name="TH"><br>
-			Target refresh rate: <input type="number" class="s" min="0" max="250" name="FR" oninput="UI()" required> FPS
-			<div id="fpsNone" class="warn" style="display: none;">&#9888; Unlimited FPS Mode is experimental &#9888;<br></div>
-			<div id="fpsHigh" class="warn" style="display: none;">&#9888; High FPS Mode is experimental.<br></div>
-			<div id="fpsWarn" class="warn" style="display: none;">Please <a class="lnk" href="sec#backup">backup</a> WLED configuration and presets first!<br></div>
-		</div>
-		<div id="cfg">Config template: <input type="file" name="data2" accept=".json"><button type="button" class="sml" onclick="loadCfg(d.Sf.data2)">Apply</button><br></div>
-		<hr>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
-	</form>
-	<div id="toast"></div>
+	</div>
+	<div class="sec">
+		<h3>Advanced</h3>
+		Palette wrapping:
+		<select name="PB">
+			<option value="0">Linear (wrap if moving)</option>
+			<option value="1">Linear (always wrap)</option>
+			<option value="2">Linear (never wrap)</option>
+			<option value="3">None (not recommended)</option>
+		</select><br>
+		Use harmonic <i>Random Cycle</i> palette: <input type="checkbox" name="TH"><br>
+		Target refresh rate: <input type="number" class="s" min="0" max="250" name="FR" oninput="UI()" required> FPS
+		<div id="fpsNone" class="warn" style="display: none;">&#9888; Unlimited FPS Mode is experimental &#9888;<br></div>
+		<div id="fpsHigh" class="warn" style="display: none;">&#9888; High FPS Mode is experimental.<br></div>
+		<div id="fpsWarn" class="warn" style="display: none;">Please <a class="lnk" href="sec#backup">backup</a> WLED configuration and presets first!<br></div>
+	</div>
+	<div id="cfg">Config template: <input type="file" name="data2" accept=".json"><button type="button" class="sml" onclick="loadCfg(d.Sf.data2)">Apply</button><br></div>
+	<hr>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
+</form>
+<div id="toast"></div>
 </body>
 </html>

From 6754f5412c293c2955fb4c1eefbf930c0a4c064c Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Fri, 30 Jan 2026 20:32:54 +0100
Subject: [PATCH 3/6] update all config pages with sections

---
 wled00/data/settings.htm      |  4 +-
 wled00/data/settings_2D.htm   | 23 +++++++----
 wled00/data/settings_pin.htm  |  2 +
 wled00/data/settings_sec.htm  | 25 ++++++++----
 wled00/data/settings_sync.htm | 38 +++++++++++++----
 wled00/data/settings_time.htm | 47 +++++++++++++--------
 wled00/data/settings_ui.htm   | 37 +++++++++--------
 wled00/data/settings_um.htm   | 29 +++++++------
 wled00/data/settings_wifi.htm | 77 +++++++++++++++++++----------------
 wled00/data/style.css         |  2 +-
 wled00/json.cpp               |  2 +-
 wled00/set.cpp                |  1 -
 wled00/xml.cpp                |  4 +-
 13 files changed, 177 insertions(+), 114 deletions(-)

diff --git a/wled00/data/settings.htm b/wled00/data/settings.htm
index 2dd926444c..8e704b9727 100644
--- a/wled00/data/settings.htm
+++ b/wled00/data/settings.htm
@@ -40,8 +40,8 @@
 </head>
 <body>
 <button type=submit id="b" onclick="window.location=getURL('/')">Back</button>
-<button type="submit" onclick="window.location=getURL('/settings/wifi')">WiFi Setup</button>
-<button type="submit" onclick="window.location=getURL('/settings/leds')">LED Preferences</button>
+<button type="submit" onclick="window.location=getURL('/settings/wifi')">WiFi & Network</button>
+<button type="submit" onclick="window.location=getURL('/settings/leds')">LED & Hardware</button>
 <button id="2dbtn" type="submit" onclick="window.location=getURL('/settings/2D')">2D Configuration</button>
 <button type="submit" onclick="window.location=getURL('/settings/ui')">User Interface</button>
 <button id="dmxbtn" style="display:none;" type="submit" onclick="window.location=getURL('/settings/dmx')">DMX Output</button>
diff --git a/wled00/data/settings_2D.htm b/wled00/data/settings_2D.htm
index 63ea4a60bf..76f84fa61b 100644
--- a/wled00/data/settings_2D.htm
+++ b/wled00/data/settings_2D.htm
@@ -49,7 +49,7 @@
 		if (p.children.length >= maxPanels) return;
 		var pw = parseInt(d.Sf.PW.value);
 		var ph = parseInt(d.Sf.PH.value);
-		let b = `<div id="pnl${i}"><hr class="sml">Panel ${i}<br>
+		let b = `<div id="pnl${i}"><b>Panel ${i}</b><br>
 1<sup>st</sup> LED: <select name="P${i}B" oninput="UI()">
 	<option value="0">Top</option>
 	<option value="1">Bottom</option>
@@ -65,7 +65,7 @@
 Dimensions (WxH): <input name="P${i}W" type="number" min="1" max="255" value="${pw}" oninput="UI()"> x <input name="P${i}H" type="number" min="1" max="255" value="${ph}" oninput="UI()"><br>
 Offset X: <input name="P${i}X" type="number" min="0" max="255" value="0" oninput="UI()">
 Y: <input name="P${i}Y" type="number" min="0" max="255" value="0" oninput="UI()"><br><i>(offset from top-left corner in # LEDs)</i>
-</div>`;
+<br><br></div>`;
 		p.insertAdjacentHTML("beforeend", b);
 	}
 
@@ -255,13 +255,15 @@
 		<button type="button" onclick="B()">Back</button><button type="button" onclick="fS()">Save</button><hr>
 	</div>
 	<h2>2D setup</h2>
+	<div class="sec">
 	Strip or panel:
 	<select id="somp" name="SOMP" onchange="resetPanels();addPanels();UI();" >
 		<option value="0">1D Strip</option>
 		<option value="1">2D Matrix</option>
-	</select><br>
+	</select>
+	</div>
 	<div id="mpdiv" style="display:none;">
-		<hr class="sml">
+	<div class="sec">
 		<h3>Matrix Generator <button type="button" id="expGen" onclick="expand(this,gId('mxGen'));">&gt;</button></h3>
 		<div id="mxGen" style="display:none;">
 			Panel dimensions (WxH): <input name="PW" type="number" min="1" max="128" value="8"> x <input name="PH" type="number" min="1" max="128" value="8"><br>
@@ -283,21 +285,26 @@ <h3>Matrix Generator <button type="button" id="expGen" onclick="expand(this,gId(
 				WARNING: You may need to update each panel parameters after they are generated.</i><br>
 			<button type="button" onclick="gen();expand(gId('expGen'),gId('mxGen'));">Populate</button>
 		</div>
-		<hr class="sml">
+	</div>
+	<div class="sec">
 		<h3>Panel set-up</h3>
 		Number of panels: <input name="MPC" type="number" min="1" max="64" value="1" oninput="addPanels();UI();"><br>
 		<i>A matrix is made of 1 or more physical LED panels.<br>
 		Each panel can be of different size and/or have different LED orientation and/or starting point and/or layout.</i><br>
+	</div>
+	<div class="sec">
 		<h3>LED panel layout</h3>
 		<div id="panels">
 		</div>
-		<hr class="sml">
-		<div id="MD"></div>
-		<canvas id="canvas"></canvas>
+	</div>
+	<div id="MD"></div>
+	<canvas id="canvas"></canvas>
+	<div class="sec">
 		<div id="json" >Gap file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/2d-gaps.json')">Upload</button></div>
 		<i>Note: Gap file is a <b>.json</b> file containing an array with number of elements equal to the matrix size.<br>
 			A value of -1 means that pixel at that position is missing, a value of 0 means never paint that pixel, and 1 means regular pixel.</i>
 	</div>
+	</div>
 	<hr>
 	<button type="button" onclick="B()">Back</button><button type="button" onclick="fS()">Save</button>
 	</form>
diff --git a/wled00/data/settings_pin.htm b/wled00/data/settings_pin.htm
index 22f94e3790..a6d8984c34 100644
--- a/wled00/data/settings_pin.htm
+++ b/wled00/data/settings_pin.htm
@@ -14,10 +14,12 @@
 </head>
 <body onload="d.getElementsByName('PIN')[0].focus()">
 	<form id="form_s" name="Sf" method="post">
+	<div class="sec">
 		<h2>Please enter settings PIN code</h2>
 		<input type="password" name="PIN" size="4" maxlength="4" minlength="4" pattern="[0-9]*" inputmode="numeric" autofocus>
 		<hr>
 		<button type="button" onclick="B()">Back</button><button type="submit">Submit</button>
+	</div>
 	</form>
 </body>
 </html>
\ No newline at end of file
diff --git a/wled00/data/settings_sec.htm b/wled00/data/settings_sec.htm
index 182e729648..c39f10aa30 100644
--- a/wled00/data/settings_sec.htm
+++ b/wled00/data/settings_sec.htm
@@ -40,12 +40,13 @@
 	</script>
 </head>
 <body>
-	<form id="form_s" name="Sf" method="post">
-		<div class="toprow">
-		<div class="helpB"><button type="button" onclick="H('features/settings/#security-settings')">?</button></div>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
-		</div>
+<form id="form_s" name="Sf" method="post">
+	<div class="toprow">
+	<div class="helpB"><button type="button" onclick="H('features/settings/#security-settings')">?</button></div>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
+	</div>
 		<h2>Security & Update setup</h2>
+	<div class="sec">
 		Settings PIN: <input type="password" id="PIN" name="PIN" size="4" maxlength="4" minlength="4" onkeydown="checkNum(this)" pattern="[0-9]*" inputmode="numeric" title="Please enter a 4 digit number"><br>
 		<div class="warn">&#9888; Unencrypted transmission. Be prudent when selecting PIN, do NOT use your banking, door, SIM, etc. pin!</div><br>
 		Lock wireless (OTA) software update: <input type="checkbox" name="NO"><br>
@@ -58,14 +59,18 @@ <h2>Security & Update setup</h2>
 		Factory reset: <input type="checkbox" name="RS"><br>
 		All settings and presets will be erased.<br><br>
 		<div class="warn">&#9888; Unencrypted transmission. An attacker on the same network can intercept form data!</div>
-		<span id="OTA"><hr>
+		<span id="OTA">
+	</div>
+	<div class="sec">
 		<h3>Software Update</h3>
 		<button type="button" onclick="U()">Manual OTA Update</button><br>
 		<div id="aOTA">Enable ArduinoOTA: <input type="checkbox" name="AO"></div>
 		Only allow update from same network/WiFi: <input type="checkbox" name="SU"><br>
 		<i class="warn">&#9888; If you are using multiple VLANs (i.e. IoT or guest network) either set PIN or disable this option.<br>
 			Disabling this option will make your device less secure.</i><br></span>
-		<hr id="backup">
+		<span id="backup">
+	</div>
+	<div class="sec">
 		<h3>Backup & Restore</h3>
 		<div class="warn">&#9888; Restoring presets/configuration will OVERWRITE your current presets/configuration.<br>
 		Incorrect upload or configuration may require a factory reset or re-flashing of your ESP.<br>
@@ -74,14 +79,16 @@ <h3>Backup & Restore</h3>
 		<div>Restore presets<br><input type="file" name="data" accept=".json"> <button type="button" onclick="uploadFile(d.Sf.data,'/presets.json');">Upload</button><br></div><br>
 		<a class="btn lnk" id="bckpresets" href="/cfg.json" download="cfg">Backup configuration</a><br>
 		<div>Restore configuration<br><input type="file" name="data2" accept=".json"> <button type="button" onclick="uploadFile(d.Sf.data2,'/cfg.json');">Upload</button><br></div>
-		<hr>
+	</div>
+	<div class="sec">
 		<h3>About</h3>
 		<a href="https://github.com/wled-dev/WLED/" target="_blank">WLED</a>&#32;version ##VERSION##<!-- Autoreplaced from package.json --><br><br>
 		<a href="https://kno.wled.ge/about/contributors/" target="_blank">Contributors, dependencies and special thanks</a><br>
 		A huge thank you to everyone who helped me create WLED!<br><br>
 		(c) 2016-2024 Christian Schwinne <br>
 		<i>Licensed under the <a href="https://github.com/wled-dev/WLED/blob/main/LICENSE" target="_blank">EUPL v1.2 license</a></i><br><br>
-		Installed version: <span class="sip">WLED ##VERSION##</span><hr>
+		Installed version: <span class="sip">WLED ##VERSION##</span>
+	</div>
 		<div id="toast"></div>
 		<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
 	</form>
diff --git a/wled00/data/settings_sync.htm b/wled00/data/settings_sync.htm
index 73e4d9a268..bbeec24e2c 100644
--- a/wled00/data/settings_sync.htm
+++ b/wled00/data/settings_sync.htm
@@ -59,15 +59,21 @@
 <button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
 </div>
 <h2>Sync setup</h2>
+<div class="sec">
 <h3>WLED Broadcast</h3>
 UDP Port: <input name="UP" type="number" min="1" max="65535" class="d5" required><br>
 2nd Port: <input name="U2" type="number" min="1" max="65535" class="d5" required><br>
+</div>
+<div class="sec">
+<h3>ESP-NOW</h3>
 <div id="NoESPNOW" class="hide">
-<i class="warn">ESP-NOW support is disabled.<br></i>
+<i class="warn">Disabled. Enable ESP-NOW in WiFi settings.<br></i>
 </div>
 <div id="ESPNOW">
 Use ESP-NOW sync: <input type="checkbox" name="EN"><br><i>(in AP mode or no WiFi)</i><br>
 </div>
+</div>
+<div class="sec">
 <h3>Sync groups</h3>
 <input name="GS" id="GS" type="number" style="display: none;"><!-- hidden inputs for bitwise group checkboxes -->
 <input name="GR" id="GR" type="number" style="display: none;">
@@ -106,9 +112,13 @@ <h3>Sync groups</h3>
 		<td><input type="checkbox" id="R8" name="R8"></td>
 	</tr>
 </table>
+</div>
+<div class="sec">
 <h3>Receive</h3>
 <nowrap><input type="checkbox" name="RB">Brightness,</nowrap> <nowrap><input type="checkbox" name="RC">Color,</nowrap> <nowrap><input type="checkbox" name="RX">Effects,</nowrap> <nowrap>and <input type="checkbox" name="RP">Palette</nowrap><br>
 <input type="checkbox" name="SO"> Segment options, <input type="checkbox" name="SG"> bounds
+</div>
+<div class="sec">
 <h3>Send</h3>
 Enable Sync on start: <input type="checkbox" name="SS"><br>
 Send notifications on direct change: <input type="checkbox" name="SD"><br>
@@ -117,11 +127,13 @@ <h3>Send</h3>
 Send Philips Hue change notifications: <input type="checkbox" name="SH"><br>
 UDP packet retransmissions: <input name="UR" type="number" min="0" max="30" class="d5" required><br><br>
 <i>Reboot required to apply changes. </i>
-<hr class="sml">
+</div>
+<div class="sec">
 <h3>Instance List</h3>
 Enable instance list: <input type="checkbox" name="NL"><br>
 Make this instance discoverable: <input type="checkbox" name="NB">
-<hr class="sml">
+</div>
+<div class="sec">
 <h3>Realtime</h3>
 Receive UDP realtime: <input type="checkbox" name="RD"><br>
 Use main segment only: <input type="checkbox" name="MO"><br>
@@ -168,12 +180,13 @@ <h4>Wired DMX Input Pins</h4>
 	DMX Port: <input name="IDMP" type="number" min="1" max="2"><br/>
 </div> 
 <div id="dmxInputOff">
-	<br><em style="color:darkorange">This firmware build does not include DMX Input support. <br></em>
+	<br><i class="warn">This firmware build does not include DMX Input support. <br></i>
 </div> 
 <div id="dmxOnOff2">
-  <br><em style="color:darkorange">This firmware build does not include DMX output support. <br></em>
+  <br><i class="warn">This firmware build does not include DMX output support. <br></i>
 </div> 
-<hr class="sml">
+</div>
+<div class="sec">
 <h3>Alexa Voice Assistant</h3>
 <div id="NoAlexa" class="hide">
 	<i class="warn">This firmware build does not include Alexa support.<br></i><br>
@@ -183,13 +196,15 @@ <h3>Alexa Voice Assistant</h3>
 Alexa invocation name: <input type="text" name="AI" maxlength="32"><br>
 Also emulate devices to call the first <input name="AP" type="number" class="s" min="0" max="9"> presets<br><br>
 </div>
-<hr class="sml">
-<div class="warn">&#9888; <b>MQTT and Hue sync all connect to external hosts!<br>
+</div>
+
+<div class="warn">&#9888; <b>MQTT and Hue sync connect to external hosts!<br>
 This may impact the responsiveness of WLED.</b><br>
 </div>
 For best results, only use one of these services at a time.<br>
 (alternatively, connect a second ESP to them and use the UDP sync)
-<hr class="sml">
+
+<div class="sec">
 <h3>MQTT</h3>
 <div id="NoMQTT" class="hide">
 	<i class="warn">This firmware build does not include MQTT support.<br></i>
@@ -209,6 +224,8 @@ <h3>MQTT</h3>
 Retain brightness & color messages: <input type="checkbox" name="RT"><br>
 <i>Reboot required to apply changes. </i><a href="https://kno.wled.ge/interfaces/mqtt/" target="_blank">MQTT info</a>
 </div>
+</div>
+<div class="sec">
 <h3>Philips Hue</h3>
 <div id="NoHue" class="hide">
 	<em class="warn">This firmware build does not include Philips Hue support.<br></em>
@@ -226,6 +243,8 @@ <h3>Philips Hue</h3>
 (when first connecting)<br>
 Hue status: <span class="sip"> Disabled in this build </span>
 </div>
+</div>
+<div class="sec">
 <h3>Serial</h3>
 <div id="NoSerial" class="hide">
 	<em class="warn">This firmware build does not support Serial interface.<br></em>
@@ -244,6 +263,7 @@ <h3>Serial</h3>
 </select><br>
 <i>Keep at 115200 to use Improv. Some boards may not support high rates.</i>
 </div>
+</div>
 <hr>
 <button type="button" onclick="B()">Back</button><button type="submit">Save</button>
 </form>
diff --git a/wled00/data/settings_time.htm b/wled00/data/settings_time.htm
index 11f3c47d9d..b7848b862b 100644
--- a/wled00/data/settings_time.htm
+++ b/wled00/data/settings_time.htm
@@ -130,12 +130,13 @@
 	</script>
 </head>
 <body>
-	<form id="form_s" name="Sf" method="post" onsubmit="Wd()">
-		<div class="toprow">
-		<div class="helpB"><button type="button" onclick="H('features/settings/#time-settings')">?</button></div>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
-		</div>
-		<h2>Time setup</h2>
+<form id="form_s" name="Sf" method="post" onsubmit="Wd()">
+	<div class="toprow">
+	<div class="helpB"><button type="button" onclick="H('features/settings/#time-settings')">?</button></div>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
+	</div>
+	<h2>Time setup</h2>
+	<div class="sec">
 		Get time from NTP server: <input type="checkbox" name="NT"><br>
 		<input type="text" name="NS" maxlength="32"><br>
 		Use 24h format: <input type="checkbox" name="CF"><br>
@@ -174,6 +175,8 @@ <h2>Time setup</h2>
 		<button type="button" id="locbtn" onclick="getLatLon()">Get location</button>
 		<div><i>(opens new tab, only works in browser)</i></div>
 		<div id="sun" class="times"></div>
+	</div>
+	<div class="sec">
 		<h3>Clock</h3>
 		Analog Clock overlay: <input type="checkbox" name="OL" onchange="Cs()"><br>
 		<div id="cac">
@@ -187,15 +190,22 @@ <h3>Clock</h3>
 		Countdown Goal:<br>
 		Date:&nbsp;<nowrap>20<input name="CY" class="xs" type="number" min="0" max="99" required>-<input name="CI" class="xs" type="number" min="1" max="12" required>-<input name="CD" class="xs" type="number" min="1" max="31" required></nowrap><br>
 		Time:&nbsp;<nowrap><input name="CH" class="xs" type="number" min="0" max="23" required>:<input name="CM" class="xs" type="number" min="0" max="59" required>:<input name="CS" class="xs" type="number" min="0" max="59" required></nowrap><br>
-		<h3>Macro presets</h3>
-		<b>Macros have moved!</b><br>
-		<i>Presets now also can be used as macros to save both JSON and HTTP API commands.<br>
-		Just enter the preset ID below!</i>
-		<i>Use 0 for the default action instead of a preset</i><br>
-		Alexa On/Off Preset: <input name="A0" class="m" type="number" min="0" max="250" required> <input name="A1" class="m" type="number" min="0" max="250" required><br>
+	</div>
+	<hr>
+	<h2>Macro Presets</h2>
+	<i>Presets can be used as macros for both JSON and HTTP API commands.<br>
+	Enter the preset ID below.</i>
+	<i>Use 0 for the default action instead of a preset</i><br>
+	<a href="https://kno.wled.ge/interfaces/json-api/" target="_blank">JSON API</a><br>
+	<a href="https://kno.wled.ge/interfaces/http-api/" target="_blank">HTTP API</a><br>
+	<div class="sec">
+		<h3>Timer & Alexa Presets</h3>
 		Countdown-Over Preset: <input name="MC" class="m" type="number" min="0" max="250" required><br>
 		Timed-Light-Over Presets: <input name="MN" class="m" type="number" min="0" max="250" required><br>
-		<h3>Button actions</h3>
+		Alexa On/Off Preset: <input name="A0" class="m" type="number" min="0" max="250" required> <input name="A1" class="m" type="number" min="0" max="250" required><br>
+	</div>
+	<div class="sec">
+		<h3>Button Action Presets</h3>
 		<table style="margin: 0 auto;" id="macros">
 			<thead>
 				<tr>
@@ -209,12 +219,15 @@ <h3>Button actions</h3>
 			</tbody>
 		</table>
 		<a href="https://kno.wled.ge/features/macros/#analog-button" target="_blank">Analog Button setup</a>
-		<h3>Time-controlled presets</h3>
+	</div>
+	<div class="sec">
+		<h3>Time-Controlled Presets</h3>
 		<div style="display: inline-block">
 		<table id="TMT" style="min-width:330px;"></table>
 		</div>
-		<hr>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
-	</form>
+	</div>
+	<hr>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
+</form>
 </body>
 </html>
diff --git a/wled00/data/settings_ui.htm b/wled00/data/settings_ui.htm
index 7955e8e699..d133aaf844 100644
--- a/wled00/data/settings_ui.htm
+++ b/wled00/data/settings_ui.htm
@@ -100,7 +100,7 @@
 						str += `${lb}: <input class="agi" type="number" id=${fk} value=${s[i]}><br>`;
 					} else if (t === 'string')
 					{
-						str += `${lb}:<br><input class="agi" id=${fk} value=${s[i]}><br>`;
+						str += `${lb}:<br><input class="agi sml" id=${fk} value=${s[i]}><br>`;
 					}
 				}
 			}
@@ -219,25 +219,28 @@
 	</script>
 </head>
 <body>
-	<form id="form_s" name="Sf" method="post">
-		<div class="toprow">
-		<div class="helpB"><button type="button" onclick="H('features/settings/#user-interface-settings')">?</button></div>
-		<button type="button" onclick="B()">Back</button><button type="button" onclick="Save()">Save</button><br>
-		<span id="lssuc" style="color:green; display:none">&#10004; Local UI settings saved!</span>
-		<span id="lserr" style="color:red; display:none">&#9888; Could not access local storage. Make sure it is enabled in your browser.</span><hr>
-		</div>
-		<h2>Web Setup</h2>
-		Server description: <input type="text" name="DS" maxlength="32"><br>
-		<!-- Sync button toggles both send and receive: <input type="checkbox" name="ST"><br> -->
+<form id="form_s" name="Sf" method="post">
+	<div class="toprow">
+	<div class="helpB"><button type="button" onclick="H('features/settings/#user-interface-settings')">?</button></div>
+	<button type="button" onclick="B()">Back</button><button type="button" onclick="Save()">Save</button><br>
+	<span id="lssuc" style="color:green; display:none">&#10004; Local UI settings saved!</span>
+	<span id="lserr" style="color:red; display:none">&#9888; Could not access local storage. Make sure it is enabled in your browser.</span><hr>
+	</div>
+	<h2>User Interface</h2>
+	<div class="sec">
+		Device Name: <input type="text" name="DS" maxlength="32"><br>
 		Enable simplified UI: <input type="checkbox" name="SU"><br>
+	</div>
+  <div class="sec">
 		<i>The following UI customization settings are unique both to the WLED device and this browser.<br>
 		You will need to set them again if using a different browser, device or WLED IP address.<br>
 		Refresh the main UI to apply changes.</i><br>
-		
+
 		<div id="gen">Loading settings...</div>
-		
+
 		<h3>UI Appearance</h3>
 		<span class="l"></span>: <input type="checkbox" id="comp_labels" class="agi cb"><br>
+		<span class="l"></span>: <input type="checkbox" id="comp_idsort" class="agi cb"><br>
 		<span class="l"></span>: <input type="checkbox" id="comp_pcmbot" class="agi cb"><br>
 		<span class="l"></span>: <input type="checkbox" id="comp_pid" class="agi cb"><br>
 		<span class="l"></span>: <input type="checkbox" id="comp_seglen" class="agi cb"><br>
@@ -246,10 +249,13 @@ <h3>UI Appearance</h3>
 		<span class="l"></span>: <input type="checkbox" id="comp_fxdef" class="agi cb"><br>
 		<span class="l"></span>: <input type="number" min=0 max=250 step=1 id="comp_on" class="agi"><br>
 		<span class="l"></span>: <input type="number" min=0 max=250 step=1 id="comp_off" class="agi"><br>
-		<span class="l"></span>: <input type="checkbox" id="comp_idsort" class="agi cb"><br>
 		I hate dark mode: <input type="checkbox" id="dm" onchange="UI()"><br>
 		<span id="idonthateyou" style="display:none"><i>Why would you? </i>&#x1F97A;<br></span>
 		<span class="l"></span>: <input type="number" min=0.0 max=1.0 step=0.01 id="theme_alpha_tab" class="agi"><br>
+		<span class="l"></span>: <input type="checkbox" id="comp_css" class="agi cb"><br>
+		<div id="skin">Custom CSS: <input type="file" name="data" accept=".css"> <input type="button" value="Upload" onclick="uploadFile(d.Sf.data,'/skin.css');"><br></div>
+
+		<h3>UI Background</h3>
 		<span class="l"></span>: <input type="number" min=0.0 max=1.0 step=0.01 id="theme_alpha_bg" class="agi"><br>
 		<span class="l"></span>: <input type="text" id="theme_color_bg" maxlength="9" class="agi"><br>
 		BG image: <input type="file" id="theme_bg_img" accept="image/*" onchange="ownBg(this)"> <input type="button" value="Remove" onclick="removeBgImg()"><br>
@@ -265,10 +271,9 @@ <h4>Random BG image settings</h4>
 			<span class="l"></span>: <input type="checkbox" id="theme_bg_rndBlur" class="agi cb" onchange="randomBg()"><br>
 		</div>
 		<input id="theme_base" class="agi" style="display:none">
-		<span class="l"></span>: <input type="checkbox" id="comp_css" class="agi cb"><br>
-		<div id="skin">Custom CSS: <input type="file" name="data" accept=".css"> <input type="button" value="Upload" onclick="uploadFile(d.Sf.data,'/skin.css');"><br></div>
 		<span class="l"></span>: <input type="checkbox" id="comp_hdays" class="agi cb"><br>
 		<div id="holidays">Holidays: <input type="file" name="data2" accept=".json"> <input type="button" value="Upload" onclick="uploadFile(d.Sf.data2,'/holidays.json');"><br></div>
+	</div>
 		<div id="toast"></div>
 		<hr><button type="button" onclick="cLS()">Clear local storage</button>
 		<hr><button type="button" onclick="B()">Back</button><button type="button" onclick="Save()">Save</button>
diff --git a/wled00/data/settings_um.htm b/wled00/data/settings_um.htm
index dbef550115..bb2113ddbc 100644
--- a/wled00/data/settings_um.htm
+++ b/wled00/data/settings_um.htm
@@ -36,8 +36,9 @@
 			urows="";
 			if (isO(umCfg)) {
 				for (const [k,o] of Object.entries(umCfg)) {
-					urows += `<hr><h3>${k}</h3>`;
+					urows += `<div class="sec"><h3>${k}</h3>`;
 					addField(k,'unknown',o);
+					urows += `</div>`;
 				}
 			}
 			if (urows==="") urows = "Usermods configuration not found.<br>Press <i>Save</i> to initialize defaults.";
@@ -290,18 +291,20 @@
 		<span id="lserr" style="color:red; display:none">&#9888; Could not load configuration.</span><hr>
 		</div>
 		<h2>Usermod Setup</h2>
-		Global I<sup>2</sup>C GPIOs (HW)<br>
-		<i class="warn">(change requires reboot!)</i><br>
-		SDA:<input type="number" min="-1" max="48" name="SDA" onchange="check(this,'if')" class="s" placeholder="SDA">
-		SCL:<input type="number" min="-1" max="48" name="SCL" onchange="check(this,'if')" class="s" placeholder="SCL">
-		<hr class="sml">
-		Global SPI GPIOs (HW)<br>
-		<i class="warn">(only changable on ESP32, change requires reboot!)</i><br>
-		MOSI:<input type="number" min="-1" max="48" name="MOSI" onchange="check(this,'if')" class="s" placeholder="MOSI">
-		MISO:<input type="number" min="-1" max="48" name="MISO" onchange="check(this,'if')" class="s" placeholder="MISO">
-		SCLK:<input type="number" min="-1" max="48" name="SCLK" onchange="check(this,'if')" class="s" placeholder="SCLK">
-		<hr class="sml">
-		Reboot after save? <input type="checkbox" name="RBT"><br>
+		<div class="sec">
+			<h3>Global I<sup>2</sup>C & SPI</h3>
+			
+			<b>I<sup>2</sup>C GPIOs (HW)</b><br>
+			SDA:<input type="number" min="-1" max="48" name="SDA" onchange="check(this,'if')" class="s" placeholder="SDA">
+			SCL:<input type="number" min="-1" max="48" name="SCL" onchange="check(this,'if')" class="s" placeholder="SCL"><br>
+			<br><b>SPI GPIOs (HW)</b><br>
+			<i class="warn">only changable on ESP32</i><br>
+			MOSI:<input type="number" min="-1" max="48" name="MOSI" onchange="check(this,'if')" class="s" placeholder="MOSI">
+			MISO:<input type="number" min="-1" max="48" name="MISO" onchange="check(this,'if')" class="s" placeholder="MISO">
+			SCLK:<input type="number" min="-1" max="48" name="SCLK" onchange="check(this,'if')" class="s" placeholder="SCLK"><br>
+			<br><i class="warn">change requires reboot!</i><br>
+			Reboot after save? <input type="checkbox" name="RBT">
+		</div>
 		<div id="um">Loading settings...</div>
 		<hr><button type="button" onclick="B()">Back</button><button type="submit">Save</button>
 	</form>
diff --git a/wled00/data/settings_wifi.htm b/wled00/data/settings_wifi.htm
index 65a04b9178..a03eeb4bfe 100644
--- a/wled00/data/settings_wifi.htm
+++ b/wled00/data/settings_wifi.htm
@@ -189,27 +189,50 @@
 	</script>
 </head>
 <body>
-  <form id="form_s" name="Sf" method="post">
-		<div class="toprow">
-		<div class="helpB"><button type="button" onclick="H('features/settings/#wifi-settings')">?</button></div>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button><hr>
-		</div>
-		<h2>WiFi setup</h2>
-		<h3>Connect to existing network</h3>
+<form id="form_s" name="Sf" method="post">
+	<div class="toprow">
+	<div class="helpB"><button type="button" onclick="H('features/settings/#wifi-settings')">?</button></div>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button><hr>
+	</div>
+	<h2>WiFi & Network Settings</h2>
+	<div class="sec">
+		<h3>Wireless network</h3>
 		<button type="button" id="scan" onclick="N()">Scan</button><br>
 		<div id="wifi">
-			Wireless networks
 			<div id="wifi_entries"></div>
 			<hr class="sml">
 			<button type="button" id="wifi_add" onclick="addWiFi()">+</button>
 			<button type="button" id="wifi_rem" onclick="remWiFi()">-</button><br>
 		</div>
+	</div>
+	<div class="sec" id="ethd">
+		<h3>Ethernet Type</h3>
+		<select name="ETH">
+			<option value="0">None</option>
+			<option value="6">IoTorero/ESP32Deux/RGB2Go</option>
+			<option value="9">ABC! WLED V43 & compatible</option>
+			<option value="2">ESP32-POE</option>
+			<option value="11">ESP32-POE-WROVER</option>
+			<option value="7">KIT-VE</option>
+			<option value="12">LILYGO T-POE Pro</option>
+			<option value="8">QuinLED-Dig-Octa & T-ETH-POE</option>
+			<option value="4">QuinLED-ESP32</option>
+			<option value="10">Serg74-ETH32</option>
+			<option value="5">TwilightLord-ESP32</option>
+			<option value="3">WESP32</option>
+			<option value="1">WT32-ETH01</option>
+			<option value="13">Gledopto</option>
+		</select><br><br>
+	</div>
+	<div class="sec">
 		DNS server address:<br>
 		<input name="D0" type="number" class="s" min="0" max="255" required>.<input name="D1" type="number" class="s" min="0" max="255" required>.<input name="D2" type="number" class="s" min="0" max="255" required>.<input name="D3" type="number" class="s" min="0" max="255" required><br>
 		<br>
 		mDNS address (leave empty for no mDNS):<br>
 		http:// <input type="text" name="CM" maxlength="32"> .local<br>
 		Client IP: <span class="sip"> Not connected </span> <br>
+	</div>
+	<div class="sec">
 		<h3>Configure Access Point</h3>
 		AP SSID (leave empty for no AP):<br> <input type="text" name="AS" maxlength="32"><br>
 		Hide AP name: <input type="checkbox" name="AH"><br>
@@ -224,11 +247,13 @@ <h3>Configure Access Point</h3>
 			<option value="4">Temporary (no connection after boot)</option>
 		</select><br>
 		AP IP: <span class="sip"> Not active </span><br>
-		<h3>Experimental</h3>
+	</div>
+	<div class="sec">
+		<h3>WiFi Power</h3>
 		Force 802.11g mode (ESP8266 only): <input type="checkbox" name="FG"><br>
 		Disable WiFi sleep: <input type="checkbox" name="WS"><br>
-		<i>Can help with connectivity issues and Audioreactive sync.<br>
-		Disabling WiFi sleep increases power consumption.</i><br>
+		<i>Disabling WiFi sleep increases power consumption<br>
+		but can help with connectivity issues and sync.</i><br><br>
 		<div id="tx">TX power: <select name="TX">
 			<option value="78">19.5 dBm</option>
 			<option value="76">19 dBm</option>
@@ -244,7 +269,8 @@ <h3>Experimental</h3>
 		</select><br>
 		<i class="warn">WARNING: Modifying TX power may render device unreachable.</i>
 		</div>
-
+	</div>
+	<div class="sec">
 		<h3>ESP-NOW Wireless</h3>
 		<div id="NoESPNOW" class="hide">
 			<i class="warn">This firmware build does not include ESP-NOW support.<br></i>
@@ -261,28 +287,9 @@ <h3>ESP-NOW Wireless</h3>
 				</div>
 			</div>
 		</div>
-
-		<div id="ethd">
-			<h3>Ethernet Type</h3>
-			<select name="ETH">
-				<option value="0">None</option>
-				<option value="6">IoTorero/ESP32Deux/RGB2Go</option>
-				<option value="9">ABC! WLED V43 & compatible</option>
-				<option value="2">ESP32-POE</option>
-				<option value="11">ESP32-POE-WROVER</option>
-				<option value="7">KIT-VE</option>
-				<option value="12">LILYGO T-POE Pro</option>
-				<option value="8">QuinLED-Dig-Octa & T-ETH-POE</option>
-				<option value="4">QuinLED-ESP32</option>
-				<option value="10">Serg74-ETH32</option>
-				<option value="5">TwilightLord-ESP32</option>
-				<option value="3">WESP32</option>
-				<option value="1">WT32-ETH01</option>
-				<option value="13">Gledopto</option>
-			</select><br><br>
-		</div>
-		<hr>
-		<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button>
-	</form>
+	</div>
+	<hr>
+	<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button>
+</form>
 </body>
 </html>
diff --git a/wled00/data/style.css b/wled00/data/style.css
index b0e9f67c8b..69bc5aa96b 100644
--- a/wled00/data/style.css
+++ b/wled00/data/style.css
@@ -5,7 +5,7 @@ body {
   font-family: Verdana, sans-serif;
   font-size: 1rem;
   text-align: center;
-  background: #000;
+  background: #111;
   color: #fff;
   line-height: 200%;
   margin: 0;
diff --git a/wled00/json.cpp b/wled00/json.cpp
index 22ba98236b..36a6d93437 100644
--- a/wled00/json.cpp
+++ b/wled00/json.cpp
@@ -748,7 +748,7 @@ void serializeInfo(JsonObject root)
   spi.add(spi_miso);
   #endif
 
-  root[F("str")] = false; //syncToggleReceive;
+  root[F("str")] = false; // sync toggle receive
 
   root[F("name")] = serverDescription;
   root[F("udpport")] = udpPort;
diff --git a/wled00/set.cpp b/wled00/set.cpp
index db8b30bac8..38e697f9b0 100644
--- a/wled00/set.cpp
+++ b/wled00/set.cpp
@@ -372,7 +372,6 @@ void handleSettingsSet(AsyncWebServerRequest *request, byte subPage)
   if (subPage == SUBPAGE_UI)
   {
     strlcpy(serverDescription, request->arg(F("DS")).c_str(), 33);
-    //syncToggleReceive = request->hasArg(F("ST"));
     simplifiedUI = request->hasArg(F("SU"));
     DEBUG_PRINTLN(F("Enumerating ledmaps"));
     enumerateLedmaps();
diff --git a/wled00/xml.cpp b/wled00/xml.cpp
index eebce343ea..f401e006d6 100644
--- a/wled00/xml.cpp
+++ b/wled00/xml.cpp
@@ -248,7 +248,7 @@ void getSettingsJS(byte subPage, Print& settingsScript)
     printSetFormValue(settingsScript,PSTR("ETH"),ethernetType);
     #else
     //hide ethernet setting if not compiled in
-    settingsScript.print(F("gId('ethd').style.display='none';"));
+    //settingsScript.print(F("gId('ethd').style.display='none';"));
     #endif
 
     if (Network.isConnected()) //is connected
@@ -587,7 +587,7 @@ void getSettingsJS(byte subPage, Print& settingsScript)
 
     char k[4];
     k[2] = 0; //Time macros
-    for (int i = 0; i<10; i++)
+    for (i = 0; i<10; i++)
     {
       k[1] = 48+i; //ascii 0,1,2,3
       if (i<8) { k[0] = 'H'; printSetFormValue(settingsScript,k,timerHours[i]); }

From 16579132e7786375f01c3ce9e948ba49017cbf0a Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Fri, 30 Jan 2026 20:45:50 +0100
Subject: [PATCH 4/6] revert debug change

---
 wled00/xml.cpp | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wled00/xml.cpp b/wled00/xml.cpp
index f401e006d6..387c7d98d3 100644
--- a/wled00/xml.cpp
+++ b/wled00/xml.cpp
@@ -248,7 +248,7 @@ void getSettingsJS(byte subPage, Print& settingsScript)
     printSetFormValue(settingsScript,PSTR("ETH"),ethernetType);
     #else
     //hide ethernet setting if not compiled in
-    //settingsScript.print(F("gId('ethd').style.display='none';"));
+    settingsScript.print(F("gId('ethd').style.display='none';"));
     #endif
 
     if (Network.isConnected()) //is connected

From 5542e934ecc19b67a84d57b414936e70d2aa3b74 Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Fri, 30 Jan 2026 21:01:43 +0100
Subject: [PATCH 5/6] move ID's

---
 wled00/data/settings_sec.htm | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/wled00/data/settings_sec.htm b/wled00/data/settings_sec.htm
index c39f10aa30..cca6e000ad 100644
--- a/wled00/data/settings_sec.htm
+++ b/wled00/data/settings_sec.htm
@@ -59,18 +59,16 @@ <h2>Security & Update setup</h2>
 		Factory reset: <input type="checkbox" name="RS"><br>
 		All settings and presets will be erased.<br><br>
 		<div class="warn">&#9888; Unencrypted transmission. An attacker on the same network can intercept form data!</div>
-		<span id="OTA">
 	</div>
-	<div class="sec">
+	<div class="sec" id="OTA">
 		<h3>Software Update</h3>
 		<button type="button" onclick="U()">Manual OTA Update</button><br>
 		<div id="aOTA">Enable ArduinoOTA: <input type="checkbox" name="AO"></div>
 		Only allow update from same network/WiFi: <input type="checkbox" name="SU"><br>
 		<i class="warn">&#9888; If you are using multiple VLANs (i.e. IoT or guest network) either set PIN or disable this option.<br>
 			Disabling this option will make your device less secure.</i><br></span>
-		<span id="backup">
 	</div>
-	<div class="sec">
+	<div class="sec" id="backup">
 		<h3>Backup & Restore</h3>
 		<div class="warn">&#9888; Restoring presets/configuration will OVERWRITE your current presets/configuration.<br>
 		Incorrect upload or configuration may require a factory reset or re-flashing of your ESP.<br>

From 93a29675186117e38fa909af21152ea8c823a06a Mon Sep 17 00:00:00 2001
From: Damian Schneider <daedae@gmx.ch>
Date: Thu, 5 Feb 2026 17:31:31 +0100
Subject: [PATCH 6/6] reordered LED settings with more natural "workflow"

after LED settings now come color & white settings, then additional hardware, then general settings. Also updated some wordings to avoid FAQ.
---
 wled00/data/settings_leds.htm | 79 +++++++++++++++++++----------------
 1 file changed, 43 insertions(+), 36 deletions(-)

diff --git a/wled00/data/settings_leds.htm b/wled00/data/settings_leds.htm
index 4b6d76ea39..b5a2bbff53 100644
--- a/wled00/data/settings_leds.htm
+++ b/wled00/data/settings_leds.htm
@@ -875,7 +875,7 @@
 	<div class="helpB"><button type="button" onclick="H('features/settings/#led-settings')">?</button></div>
 	<button type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
 	</div>
-	<h2>Hardware setup</h2>
+	<h2>LED setup</h2>
 	<div class="sec">
 		<h3>LED setup</h3>
 		Total LEDs: <span id="lc">?</span> <span id="pc"></span><br>
@@ -883,6 +883,7 @@ <h3>LED setup</h3>
 		<b><span id="psu">?</span></b><br>
 		<span id="psu2"><br></span>
 		<br>
+		Global brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %<br>
 		Enable automatic brightness limiter: <input type="checkbox" name="ABL" onchange="enABL()"><br>
 		<div id="abl">
 			<i>Automatically limits brightness to stay close to the limit.<br>
@@ -890,7 +891,7 @@ <h3>LED setup</h3>
 				If using multiple outputs it is recommended to use per-output limiter.<br>
 				Analog (PWM) and virtual LEDs cannot use automatic brightness limiter.<br></i>
 			<div id="psuMA">Maximum PSU Current: <input name="MA" type="number" class="xl" min="250" max="65000" oninput="UI()" required> mA<br></div>
-			Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br>
+			Use per-output limiter: <input type="checkbox" name="PPL" onchange="UI()"><br><br>
 			<div id="ppldis" style="display:none;">
 				<i>Make sure you enter correct value for each LED output.<br>
 				If using multiple outputs with only one PSU, distribute its power proportionally amongst outputs.</i><br>
@@ -902,7 +903,7 @@ <h3>LED setup</h3>
 				multiple power injection points and a fuse!<br>
 			</div>
 		</div>
-		<div id="mLC">LED outputs:</div>
+		<div id="mLC"><h4>LED outputs:</h4></div>
 		<hr class="sml">
 		<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
 		<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
@@ -925,6 +926,30 @@ <h3>LED setup</h3>
 			<button type="button" id="com_rem" onclick="remCOM()">-</button>
 		</div>
 	</div>
+	<div class="sec">
+		<h3>Color & White</h3>
+		Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
+		Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
+		Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
+		White Balance correction: <input type="checkbox" name="CCT"><br>
+		<div id="wc">
+			Global override for Auto-calculate white:
+			<select name="AW">
+				<option value=255>Disabled</option>
+				<option value=0>None</option>
+				<option value=1>Brighter</option>
+				<option value=2>Accurate</option>
+				<option value=3>Dual</option>
+				<option value=4>Max</option>
+			</select>
+			<br>
+			Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
+			CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
+			CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
+			<i class="warn"><b>⚠</b> Set to 0 when using 2-wire (reverse polarity) CCT strips</i><br><br>
+		</div>
+	</div>
+	<h2>Hardware setup</h2>
 	<div class="sec">
 		<h3>Buttons</h3>
 		<div id="btn_wrap">
@@ -934,7 +959,7 @@ <h3>Buttons</h3>
 			<button type="button" id="btn_rem" onclick="remBtn()">-</button>
 		</div>
 		Disable internal pull-up/down: <input type="checkbox" name="IP"><br>
-		Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
+		Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br><br>
 	</div>
 	<div class="sec">
 		<h3>IR Remote</h3>
@@ -951,28 +976,29 @@ <h3>IR Remote</h3>
 		</select><span style="cursor: pointer;" onclick="off('IR')">&nbsp;&#x2715;</span><br>
 		Apply IR change to main segment only: <input type="checkbox" name="MSO"><br>
 		<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile(d.Sf.data,'/ir.json')">Upload</button><br></div>
-		<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
+		<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br><br>
 	</div>
 	<div class="sec">
 		<h3>Relay</h3>
 		Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
-		Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br>
+		Invert <input type="checkbox" name="RM"> Open drain <input type="checkbox" name="RO"><br><br>
 	</div>
 	<h2>General settings</h2>
 	<div class="sec">
-		<h3>Defaults</h3>
+		<h3>Power up</h3>
 		Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
-		Default brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br><br>
-		Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 uses values from above)<br><br>
-		Use Gamma correction for color: <input type="checkbox" name="GC"> (strongly recommended)<br>
-		Use Gamma correction for brightness: <input type="checkbox" name="GB"> (not recommended)<br>
-		Use Gamma value: <input name="GV" type="number" class="m" placeholder="2.8" min="1" max="3" step="0.1" required><br><br>
-		Brightness factor: <input name="BF" type="number" class="m" min="1" max="255" required> %
+		with brightness: <input name="CA" type="number" class="m" min="1" max="255" required> (1-255)<br>
+		<i>(disable if using boot preset to turn LEDs on)</i><br><br>
+		Apply preset <input name="BP" type="number" class="m" min="0" max="250" required> at boot (0 = none)<br><br>
 	</div>
 	<div class="sec">
 		<h3>Transitions</h3>
-		Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br>
-		<i>Random Cycle</i> Palette Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br>
+		Default transition time: <input name="TD" type="number" class="xl" min="0" max="65500"> ms<br><br>
+	</div>
+	<div class="sec">
+		<h3>Random Palettes</h3>
+		Use harmonic colors in <i>Random palettes</i>: <input type="checkbox" name="TH"><br>
+		<i>Random Palette</i> Cycle Time: <input name="TP" type="number" class="m" min="1" max="255"> s<br><br>
 	</div>
 	<div class="sec">
 		<h3>Timed light</h3>
@@ -985,26 +1011,7 @@ <h3>Timed light</h3>
 			<option value="2">Fade Color</option>
 			<option value="3">Sunrise</option>
 		</select>
-	</div>
-	<div class="sec">
-		<h3>White management</h3>
-		White Balance correction: <input type="checkbox" name="CCT"><br>
-		<div id="wc">
-			Global override for Auto-calculate white:<br>
-			<select name="AW">
-				<option value=255>Disabled</option>
-				<option value=0>None</option>
-				<option value=1>Brighter</option>
-				<option value=2>Accurate</option>
-				<option value=3>Dual</option>
-				<option value=4>Max</option>
-			</select>
-			<br>
-			Calculate CCT from RGB: <input type="checkbox" name="CR"><br>
-			CCT IC used (Athom 15W): <input type="checkbox" name="IC"><br>
-			CCT additive blending: <input type="number" class="s" min="0" max="100" name="CB" onchange="UI()" required> %<br>
-			<i class="warn">WARNING: When using H-bridge for reverse polarity (2-wire) CCT LED strip<br><b>make sure this value is 0</b>.<br>(ESP32 variants only, ESP8266 does not support H-bridges)</i>
-		</div>
+		<br><br>
 	</div>
 	<div class="sec">
 		<h3>Advanced</h3>
@@ -1015,11 +1022,11 @@ <h3>Advanced</h3>
 			<option value="2">Linear (never wrap)</option>
 			<option value="3">None (not recommended)</option>
 		</select><br>
-		Use harmonic <i>Random Cycle</i> palette: <input type="checkbox" name="TH"><br>
 		Target refresh rate: <input type="number" class="s" min="0" max="250" name="FR" oninput="UI()" required> FPS
 		<div id="fpsNone" class="warn" style="display: none;">&#9888; Unlimited FPS Mode is experimental &#9888;<br></div>
 		<div id="fpsHigh" class="warn" style="display: none;">&#9888; High FPS Mode is experimental.<br></div>
 		<div id="fpsWarn" class="warn" style="display: none;">Please <a class="lnk" href="sec#backup">backup</a> WLED configuration and presets first!<br></div>
+		<br><br>
 	</div>
 	<div id="cfg">Config template: <input type="file" name="data2" accept=".json"><button type="button" class="sml" onclick="loadCfg(d.Sf.data2)">Apply</button><br></div>
 	<hr>