diff --git a/content/control.md b/content/control.md
index 018adbc..f7f654b 100644
--- a/content/control.md
+++ b/content/control.md
@@ -63,11 +63,11 @@ setTimeout(keepQrCodeUpdated, 10);
 </form>
 
 ## Background
-<form class="form" class="black-80 sans-serif w-100" onsubmit="return false;">
+<form id="backgroundForm" class="black-80 sans-serif w-100" onsubmit="return false;">
     <label for="backgroundColor" class="f6 b db mb1 mt3 sans-serif mid-gray">
         Color:
     </label>
-    <input id="backgroundColor" name="backgroundColor" type="text" class="w-90 f5 pv3 ph3 bg-light-gray bn" value="transparent" onkeyup="updateMediaPreviewAfterChange(); broadcastChanges()" onkeydown="updateMediaPreviewAfterChange(); broadcastChanges()" onchange="updateMediaPreviewAfterChange(); broadcastChanges()">
+    <input id="backgroundColor" name="backgroundColor" type="text" class="w-90 f5 pv3 ph3 bg-light-gray bn" value="transparent" onkeyup="updateMediaPreviewAfterChange(); broadcastBackgroundChanges()" onkeydown="updateMediaPreviewAfterChange(); broadcastBackgroundChanges()" onchange="updateMediaPreviewAfterChange(); broadcastBackgroundChanges()">
     <label for="backgroundMedia" class="f6 b db mb1 mt3 sans-serif mid-gray">
         Media:
     </label>
diff --git a/static/js/control.js b/static/js/control.js
index 203df36..e2306ab 100644
--- a/static/js/control.js
+++ b/static/js/control.js
@@ -2,6 +2,7 @@ var loadingNewData = false;
 var indexFromWebSocket = false;
 var acceptingRemoteSettings = true;
 var currentForm = document.getElementById('currentForm');
+var backgroundForm = document.getElementById('backgroundForm');
 var currentDisplayIndex = 0;
 var nbsp = ' ';
 var preview_frame = document.getElementById('preview_frame');
@@ -29,7 +30,7 @@ function handleBroadcastedMessage(message) {
     if (message.type == 'SettingsRequest')
         sendThroughWebSocket(JSON.stringify({
             type: 'Settings',
-            settings: getSettings()
+            settings: putForm(backgroundForm, getSettings())
         }));
     else if ((message.type == 'NewSettings') || (message.type == 'Settings' && acceptingRemoteSettings)) {
         acceptingRemoteSettings = true;
@@ -51,11 +52,16 @@ function downloadTextFile(filename, text) {
     document.body.removeChild(element);
 }
 
+function putForm(form, settings) {
+    for (let keyPair of Array.from((new FormData(form)).entries()))
+        settings[keyPair[0]] = keyPair[1];
+    return settings;
+}
+
 function getSettings() {
     var settings = {};
-    for (var form of Array.from(document.querySelectorAll('form.form')))
-        for (var keyPair of Array.from((new FormData(form)).entries()))
-            settings[keyPair[0]] = keyPair[1];
+    for (let form of Array.from(document.querySelectorAll('form.form')))
+        putForm(form, settings);
     settings.templateParams = getTemplateParameters();
     return settings;
 }
@@ -64,7 +70,7 @@ function saveSettings() {
     var token = window.location.hash.substr(1);
     downloadTextFile(
         `manual-notifier_settings_${token}.json`,
-        JSON.stringify(getSettings())
+        JSON.stringify(putForm(backgroundForm, getSettings()))
     );
 }
 
@@ -86,7 +92,7 @@ function loadBackgroundMedia(input) {
         var backgroundMediaHidden = document.getElementById('backgroundMediaHidden');
         backgroundMediaHidden.value = '';
         updateMediaPreviewAfterChange();
-        broadcastChanges();
+        broadcastBackgroundChanges();
     } else {
         var file = input.files[0];
         input.value = null;
@@ -96,7 +102,7 @@ function loadBackgroundMedia(input) {
             var backgroundMediaHidden = document.getElementById('backgroundMediaHidden');
             backgroundMediaHidden.value = fr.result;
             updateMediaPreviewAfterChange();
-            broadcastChanges();
+            broadcastBackgroundChanges();
         };
     }
 }
@@ -137,17 +143,19 @@ function applyLoadedSettings(settings) {
     updateMediaPreviewAfterChange();
     loadingNewData = false;
     if (!acceptingRemoteSettings)
-        broadcastChanges(); // only once
+        broadcastBackgroundChanges(); // only once
 }
 
-function broadcastChanges() {
+function broadcastChanges(backgrounded) {
     if (!loadingNewData)
         sendThroughWebSocket(JSON.stringify({
             type: 'NewSettings',
-            settings: getSettings()
+            settings: backgrounded ? putForm(backgroundForm, getSettings()) : getSettings()
         }));
 }
 
+broadcastBackgroundChanges = () => broadcastChanges(true);
+
 var escapeHtml = (unsafe) => (unsafe
     .replace(/&/g, "&amp;")
     .replace(/</g, "&lt;")
@@ -220,6 +228,6 @@ updateSendFields();
 function sendToDisplay() {
     sendThroughWebSocket(JSON.stringify({
         type: 'SendToDisplay',
-        settings: getSettings()
+        settings: putForm(backgroundForm, getSettings())
     }));
 }
\ No newline at end of file