diff --git a/packages/node_modules/@node-red/editor-client/src/js/red.js b/packages/node_modules/@node-red/editor-client/src/js/red.js
index 787166c00..0a9775ca2 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/red.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/red.js
@@ -115,9 +115,9 @@ var RED = (function() {
                 var stepConfig = function() {
                     if (configs.length === 0) {
                         $("body").i18n();
-                        $("#palette > .palette-spinner").hide();
-                        $(".palette-scroll").removeClass("hide");
-                        $("#palette-search").removeClass("hide");
+                        $("#red-ui-palette > .red-ui-palette-spinner").hide();
+                        $(".red-ui-palette-scroll").removeClass("hide");
+                        $("#red-ui-palette-search").removeClass("hide");
                         loadFlows(function() {
                             if (RED.settings.theme("projects.enabled",false)) {
                                 RED.projects.refresh(function(activeProject) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/stack.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/stack.js
index 0cb410b29..ddb88b549 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/stack.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/stack.js
@@ -45,11 +45,11 @@ RED.stack = (function() {
         return {
             add: function(entry) {
                 entries.push(entry);
-                entry.container = $('<div class="palette-category">').appendTo(container);
+                entry.container = $('<div class="red-ui-palette-category">').appendTo(container);
                 if (!visible) {
                     entry.container.hide();
                 }
-                var header = $('<div class="palette-header"></div>').appendTo(entry.container);
+                var header = $('<div class="red-ui-palette-header"></div>').appendTo(entry.container);
                 entry.header = header;
                 entry.contentWrap = $('<div></div>',{style:"position:relative"}).appendTo(entry.container);
                 if (options.fill) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js b/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
index 5fe8be1e3..9a5a56d99 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js
@@ -273,7 +273,7 @@ RED.deploy = (function() {
         deployInflight = true;
         $("#header-shade").show();
         $("#editor-shade").show();
-        $("#palette-shade").show();
+        $("#red-ui-palette-shade").show();
         $("#sidebar-shade").show();
 
         $.ajax({
@@ -308,7 +308,7 @@ RED.deploy = (function() {
                 $(".deploy-button-spinner").hide();
                 $("#header-shade").hide();
                 $("#editor-shade").hide();
-                $("#palette-shade").hide();
+                $("#red-ui-palette-shade").hide();
                 $("#sidebar-shade").hide();
             },delta);
         });
@@ -424,7 +424,7 @@ RED.deploy = (function() {
             deployInflight = true;
             $("#header-shade").show();
             $("#editor-shade").show();
-            $("#palette-shade").show();
+            $("#red-ui-palette-shade").show();
             $("#sidebar-shade").show();
             $.ajax({
                 url:"flows",
@@ -494,7 +494,7 @@ RED.deploy = (function() {
                     $(".deploy-button-spinner").hide();
                     $("#header-shade").hide();
                     $("#editor-shade").hide();
-                    $("#palette-shade").hide();
+                    $("#red-ui-palette-shade").hide();
                     $("#sidebar-shade").hide();
                 },delta);
             });
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/diff.js b/packages/node_modules/@node-red/editor-client/src/js/ui/diff.js
index e73dc7ec1..fd7a9bc7d 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/diff.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/diff.js
@@ -497,7 +497,7 @@ RED.diff = (function() {
         }
         nodeDiv.css('backgroundColor',colour);
 
-        var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
+        var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
         RED.utils.createIconElement(icon_url, iconContainer, false);
 
         return nodeDiv;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js
index 6288afc7b..aa4dd1f16 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js
@@ -913,7 +913,7 @@ RED.editor = (function() {
                     var icon_url = RED.settings.apiRootUrl+"icons/"+moduleName+"/"+icon;
                     iconDiv.data('icon',icon_url);
                     nodeDiv.css('backgroundColor',colour);
-                    var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
+                    var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
                     RED.utils.createIconElement(icon_url, iconContainer, true);
 
                     if (iconPath.module === moduleName && iconPath.file === icon) {
@@ -983,7 +983,7 @@ RED.editor = (function() {
             var colour = RED.utils.getNodeColor(node.type, node._def);
             var icon_url = RED.utils.getNodeIcon(node._def,node);
             nodeDiv.css('backgroundColor',colour);
-            var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
+            var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
             RED.utils.createIconElement(icon_url, iconContainer, true);
 
             iconButton.on("click", function(e) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js b/packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js
index 7e224b524..7962e83bc 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js
@@ -580,7 +580,7 @@ RED.palette.editor = (function() {
             content: modulesTab
         })
 
-        var filterDiv = $('<div>',{class:"palette-search"}).appendTo(modulesTab);
+        var filterDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(modulesTab);
         filterInput = $('<input type="text" data-i18n="[placeholder]palette.filter"></input>')
             .appendTo(filterDiv)
             .searchBox({
@@ -643,7 +643,7 @@ RED.palette.editor = (function() {
                     var enableButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.disableall')).appendTo(buttonGroup);
 
                     var contentRow = $('<div>',{class:"palette-module-content"}).appendTo(container);
-                    var shade = $('<div class="palette-module-shade hide"><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(container);
+                    var shade = $('<div class="palette-module-shade hide"><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(container);
 
                     object.elements = {
                         updateButton: updateButton,
@@ -736,7 +736,7 @@ RED.palette.editor = (function() {
 
         var toolBar = $('<div>',{class:"palette-editor-toolbar"}).appendTo(installTab);
 
-        var searchDiv = $('<div>',{class:"palette-search"}).appendTo(installTab);
+        var searchDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(installTab);
         searchInput = $('<input type="text" data-i18n="[placeholder]palette.search"></input>')
             .appendTo(searchDiv)
             .searchBox({
@@ -875,7 +875,7 @@ RED.palette.editor = (function() {
             }
         });
 
-        $('<div id="palette-module-install-shade" class="palette-module-shade hide"><div class="palette-module-shade-status"></div><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(installTab);
+        $('<div id="palette-module-install-shade" class="palette-module-shade hide"><div class="palette-module-shade-status"></div><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(installTab);
     }
     function update(entry,version,container,done) {
         if (RED.settings.theme('palette.editable') === false) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
index 8a22eecbb..a4268140e 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js
@@ -23,43 +23,43 @@ RED.palette = (function() {
     var sidebarControls;
 
     function createCategory(originalCategory,rootCategory,category,ns) {
-        if ($("#palette-base-category-"+rootCategory).length === 0) {
+        if ($("#red-ui-palette-base-category-"+rootCategory).length === 0) {
             createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory);
         }
-        $("#palette-container-"+rootCategory).show();
-        if ($("#palette-"+category).length === 0) {
-            $("#palette-base-category-"+rootCategory).append('<div id="palette-'+category+'"></div>');
+        $("#red-ui-palette-container-"+rootCategory).show();
+        if ($("#red-ui-palette-"+category).length === 0) {
+            $("#red-ui-palette-base-category-"+rootCategory).append('<div id="red-ui-palette-'+category+'"></div>');
         }
     }
     function createCategoryContainer(originalCategory,category, labelId) {
         var label = RED._(labelId, {defaultValue:category});
         label = (label || category).replace(/_/g, " ");
-        var catDiv = $('<div id="palette-container-'+category+'" class="palette-category palette-close hide">'+
-            '<div id="palette-header-'+category+'" class="palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+
-            '<div class="palette-content" id="palette-base-category-'+category+'">'+
-            '<div id="palette-'+category+'-input"></div>'+
-            '<div id="palette-'+category+'-output"></div>'+
-            '<div id="palette-'+category+'-function"></div>'+
+        var catDiv = $('<div id="red-ui-palette-container-'+category+'" class="red-ui-palette-category palette-close hide">'+
+            '<div id="red-ui-palette-header-'+category+'" class="red-ui-palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+
+            '<div class="red-ui-palette-content" id="red-ui-palette-base-category-'+category+'">'+
+            '<div id="red-ui-palette-'+category+'-input"></div>'+
+            '<div id="red-ui-palette-'+category+'-output"></div>'+
+            '<div id="red-ui-palette-'+category+'-function"></div>'+
             '</div>'+
-            '</div>').appendTo("#palette-container");
+            '</div>').appendTo("#red-ui-palette-container");
         catDiv.data('category',originalCategory);
         catDiv.data('label',label);
         categoryContainers[category] = {
             container: catDiv,
             close: function() {
-                catDiv.removeClass("palette-open");
-                catDiv.addClass("palette-closed");
-                $("#palette-base-category-"+category).slideUp();
-                $("#palette-header-"+category+" i").removeClass("expanded");
+                catDiv.removeClass("red-ui-palette-open");
+                catDiv.addClass("red-ui-palette-closed");
+                $("#red-ui-palette-base-category-"+category).slideUp();
+                $("#red-ui-palette-header-"+category+" i").removeClass("expanded");
             },
             open: function() {
-                catDiv.addClass("palette-open");
-                catDiv.removeClass("palette-closed");
-                $("#palette-base-category-"+category).slideDown();
-                $("#palette-header-"+category+" i").addClass("expanded");
+                catDiv.addClass("red-ui-palette-open");
+                catDiv.removeClass("red-ui-palette-closed");
+                $("#red-ui-palette-base-category-"+category).slideDown();
+                $("#red-ui-palette-header-"+category+" i").addClass("expanded");
             },
             toggle: function() {
-                if (catDiv.hasClass("palette-open")) {
+                if (catDiv.hasClass("red-ui-palette-open")) {
                     categoryContainers[category].close();
                 } else {
                     categoryContainers[category].open();
@@ -67,7 +67,7 @@ RED.palette = (function() {
             }
         };
 
-        $("#palette-header-"+category).on('click', function(e) {
+        $("#red-ui-palette-header-"+category).on('click', function(e) {
             categoryContainers[category].toggle();
         });
     }
@@ -85,17 +85,17 @@ RED.palette = (function() {
         var displayLines = [];
 
         var currentLine = words[0];
-        var currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0);
+        var currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
 
         for (var i=1;i<words.length;i++) {
-            var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "palette_label", 0);
+            var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "red-ui-palette-label", 0);
             if (newWidth < nodeWidth) {
                 currentLine += " "+words[i];
                 currentLineWidth = newWidth;
             } else {
                 displayLines.push(currentLine);
                 currentLine = words[i];
-                currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0);
+                currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
             }
         }
         displayLines.push(currentLine);
@@ -104,10 +104,10 @@ RED.palette = (function() {
         var multiLineNodeHeight = 8+(lineHeight*displayLines.length);
         el.css({height:multiLineNodeHeight+"px"});
 
-        var labelElement = el.find(".palette_label");
+        var labelElement = el.find(".red-ui-palette-label");
         labelElement.html(lines).attr('dir', RED.text.bidi.resolveBaseTextDir(lines));
 
-        el.find(".palette_port").css({top:(multiLineNodeHeight/2-5)+"px"});
+        el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px"});
 
         var popOverContent;
         try {
@@ -145,7 +145,7 @@ RED.palette = (function() {
 
     function setIcon(element,sf) {
         var icon_url = RED.utils.getNodeIcon(sf._def);
-        var iconContainer = element.find(".palette_icon_container");
+        var iconContainer = element.find(".red-ui-palette-icon-container");
         RED.utils.createIconElement(icon_url, iconContainer, true);
     }
 
@@ -155,7 +155,7 @@ RED.palette = (function() {
 
     function addNodeType(nt,def) {
         var nodeTypeId = escapeNodeType(nt);
-        if ($("#palette_node_"+nodeTypeId).length) {
+        if ($("#red-ui-palette-node_"+nodeTypeId).length) {
             return;
         }
         if (exclusion.indexOf(def.category)===-1) {
@@ -165,7 +165,7 @@ RED.palette = (function() {
             var rootCategory = category.split("-")[0];
 
             var d = document.createElement("div");
-            d.id = "palette_node_"+nodeTypeId;
+            d.id = "red-ui-palette-node_"+nodeTypeId;
             d.type = nt;
 
             var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];
@@ -178,17 +178,17 @@ RED.palette = (function() {
             }
 
             $('<div/>', {
-                class: "palette_label"
-                     + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_label_right" : "")
+                class: "red-ui-palette-label"
+                     + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-label-right" : "")
             }).appendTo(d);
 
-            d.className="palette_node";
+            d.className="red-ui-palette-node";
 
             if (def.icon) {
                 var icon_url = RED.utils.getNodeIcon(def);
                 var iconContainer = $('<div/>', {
-                    class: "palette_icon_container"
-                         + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_icon_container_right" : "")
+                    class: "red-ui-palette-icon-container"
+                         + (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-icon-container-right" : "")
                 }).appendTo(d);
                 RED.utils.createIconElement(icon_url, iconContainer, true);
             }
@@ -197,19 +197,19 @@ RED.palette = (function() {
 
             if (def.outputs > 0) {
                 var portOut = document.createElement("div");
-                portOut.className = "palette_port palette_port_output";
+                portOut.className = "red-ui-palette-port red-ui-palette-port-output";
                 d.appendChild(portOut);
             }
 
             if (def.inputs > 0) {
                 var portIn = document.createElement("div");
-                portIn.className = "palette_port palette_port_input";
+                portIn.className = "red-ui-palette-port red-ui-palette-port-input";
                 d.appendChild(portIn);
             }
 
             createCategory(def.category,rootCategory,category,(coreCategories.indexOf(rootCategory) !== -1)?"node-red":def.set.id);
 
-            $("#palette-"+category).append(d);
+            $("#red-ui-palette-"+category).append(d);
 
             $(d).data('category',rootCategory);
 
@@ -258,8 +258,8 @@ RED.palette = (function() {
                 revertDuration: 300,
                 containment:'#main-container',
                 start: function() {
-                    paletteWidth = $("#palette").width();
-                    paletteTop = $("#palette").parent().position().top + $("#palette-container").position().top;
+                    paletteWidth = $("#red-ui-palette").width();
+                    paletteTop = $("#red-ui-palette").parent().position().top + $("#red-ui-palette-container").position().top;
                     RED.view.focus();
                 },
                 stop: function() { d3.select('.link_splice').classed('link_splice',false); if (spliceTimer) { clearTimeout(spliceTimer); spliceTimer = null;}},
@@ -338,8 +338,8 @@ RED.palette = (function() {
             }
             setLabel(nt,$(d),label,nodeInfo);
 
-            var categoryNode = $("#palette-container-"+rootCategory);
-            if (categoryNode.find(".palette_node").length === 1) {
+            var categoryNode = $("#red-ui-palette-container-"+rootCategory);
+            if (categoryNode.find(".red-ui-palette-node").length === 1) {
                 categoryContainers[rootCategory].open();
             }
 
@@ -348,12 +348,12 @@ RED.palette = (function() {
 
     function removeNodeType(nt) {
         var nodeTypeId = escapeNodeType(nt);
-        var paletteNode = $("#palette_node_"+nodeTypeId);
-        var categoryNode = paletteNode.closest(".palette-category");
+        var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
+        var categoryNode = paletteNode.closest(".red-ui-palette-category");
         paletteNode.remove();
-        if (categoryNode.find(".palette_node").length === 0) {
+        if (categoryNode.find(".red-ui-palette-node").length === 0) {
             if (categoryNode.find("i").hasClass("expanded")) {
-                categoryNode.find(".palette-content").slideToggle();
+                categoryNode.find(".red-ui-palette-content").slideToggle();
                 categoryNode.find("i").toggleClass("expanded");
             }
         }
@@ -361,10 +361,10 @@ RED.palette = (function() {
 
     function hideNodeType(nt) {
         var nodeTypeId = escapeNodeType(nt);
-        var paletteNode = $("#palette_node_"+nodeTypeId);
+        var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
         paletteNode.hide();
-        var categoryNode = paletteNode.closest(".palette-category");
-        var cl = categoryNode.find(".palette_node");
+        var categoryNode = paletteNode.closest(".red-ui-palette-category");
+        var cl = categoryNode.find(".red-ui-palette-node");
         var c = 0;
         for (var i = 0; i < cl.length; i++) {
             if ($(cl[i]).css('display') === 'none') { c += 1; }
@@ -374,32 +374,32 @@ RED.palette = (function() {
 
     function showNodeType(nt) {
         var nodeTypeId = escapeNodeType(nt);
-        var paletteNode = $("#palette_node_"+nodeTypeId);
-        var categoryNode = paletteNode.closest(".palette-category");
+        var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
+        var categoryNode = paletteNode.closest(".red-ui-palette-category");
         categoryNode.show();
         paletteNode.show();
     }
 
     function refreshNodeTypes() {
         RED.nodes.eachSubflow(function(sf) {
-            var paletteNode = $("#palette_node_subflow_"+sf.id.replace(".","_"));
-            var portInput = paletteNode.find(".palette_port_input");
-            var portOutput = paletteNode.find(".palette_port_output");
+            var paletteNode = $("#red-ui-palette-node_subflow_"+sf.id.replace(".","_"));
+            var portInput = paletteNode.find(".red-ui-palette-port-input");
+            var portOutput = paletteNode.find(".red-ui-palette-port-output");
 
-            var paletteLabel = paletteNode.find(".palette_label");
-            paletteLabel.attr("class","palette_label"
-                 + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_label_right" : "")
+            var paletteLabel = paletteNode.find(".red-ui-palette-label");
+            paletteLabel.attr("class","red-ui-palette-label"
+                 + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-label-right" : "")
              );
 
-            var paletteIconContainer = paletteNode.find(".palette_icon_container");
-            paletteIconContainer.attr("class","palette_icon_container"
-                  + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_icon_container_right" : "")
+            var paletteIconContainer = paletteNode.find(".red-ui-palette-icon-container");
+            paletteIconContainer.attr("class","red-ui-palette-icon-container"
+                  + (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-icon-container-right" : "")
               );
 
 
             if (portInput.length === 0 && sf.in.length > 0) {
                 var portIn = document.createElement("div");
-                portIn.className = "palette_port palette_port_input";
+                portIn.className = "red-ui-palette-port red-ui-palette-port-input";
                 paletteNode.append(portIn);
             } else if (portInput.length !== 0 && sf.in.length === 0) {
                 portInput.remove();
@@ -407,7 +407,7 @@ RED.palette = (function() {
 
             if (portOutput.length === 0 && sf.out.length > 0) {
                 var portOut = document.createElement("div");
-                portOut.className = "palette_port palette_port_output";
+                portOut.className = "red-ui-palette-port red-ui-palette-port-output";
                 paletteNode.append(portOut);
             } else if (portOutput.length !== 0 && sf.out.length === 0) {
                 portOutput.remove();
@@ -421,17 +421,17 @@ RED.palette = (function() {
                 var category = newCategory.replace(/ /g,"_");
                 createCategory(newCategory,category,category,"node-red");
 
-                var currentCategoryNode = paletteNode.closest(".palette-category");
+                var currentCategoryNode = paletteNode.closest(".red-ui-palette-category");
                 var newCategoryNode = $("#palette-"+category);
                 newCategoryNode.append(paletteNode);
-                if (newCategoryNode.find(".palette_node").length === 1) {
+                if (newCategoryNode.find(".red-ui-palette-node").length === 1) {
                     categoryContainers[category].open();
                 }
 
                 paletteNode.data('category',newCategory);
-                if (currentCategoryNode.find(".palette_node").length === 0) {
+                if (currentCategoryNode.find(".red-ui-palette-node").length === 0) {
                     if (currentCategoryNode.find("i").hasClass("expanded")) {
-                        currentCategoryNode.find(".palette-content").slideToggle();
+                        currentCategoryNode.find(".red-ui-palette-content").slideToggle();
                         currentCategoryNode.find("i").toggleClass("expanded");
                     }
                 }
@@ -444,8 +444,8 @@ RED.palette = (function() {
 
     function filterChange(val) {
         var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i');
-        $("#palette-container .palette_node").each(function(i,el) {
-            var currentLabel = $(el).find(".palette_label").text();
+        $("#red-ui-palette-container .red-ui-palette-node").each(function(i,el) {
+            var currentLabel = $(el).find(".red-ui-palette-label").text();
             if (val === "" || re.test(el.id) || re.test(currentLabel)) {
                 $(this).show();
             } else {
@@ -456,7 +456,7 @@ RED.palette = (function() {
         for (var category in categoryContainers) {
             if (categoryContainers.hasOwnProperty(category)) {
                 if (categoryContainers[category].container
-                        .find(".palette_node")
+                        .find(".red-ui-palette-node")
                         .filter(function() { return $(this).css('display') !== 'none'}).length === 0) {
                     categoryContainers[category].close();
                 } else {
@@ -468,6 +468,13 @@ RED.palette = (function() {
 
     function init() {
 
+        $('<img src="red/images/spin.svg" class="red-ui-palette-spinner hide"/>').appendTo("#red-ui-palette");
+        $('<div id="red-ui-palette-search" class="red-ui-palette-search hide"><input type="text" data-i18n="[placeholder]palette.filter"></input></div>').appendTo("#red-ui-palette");
+        $('<div id="red-ui-palette-container" class="red-ui-palette-scroll hide"></div>').appendTo("#red-ui-palette");
+        $('<div class="red-ui-component-footer"></div>').appendTo("#red-ui-palette");
+        $('<div id="red-ui-palette-shade" class="hide"></div>').appendTo("#red-ui-palette");
+
+
         RED.events.on('registry:node-type-added', function(nodeType) {
             var def = RED.nodes.getType(nodeType);
             addNodeType(nodeType,def);
@@ -508,25 +515,26 @@ RED.palette = (function() {
             }
         });
 
-        $("#palette > .palette-spinner").show();
+        $("#red-ui-palette > .red-ui-palette-spinner").show();
 
-        $("#palette-search input").searchBox({
+
+        $("#red-ui-palette-search input").searchBox({
             delay: 100,
             change: function() {
                 filterChange($(this).val());
             }
         })
 
-        sidebarControls = $('<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>').appendTo($("#palette"));
+        sidebarControls = $('<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>').appendTo($("#red-ui-palette"));
         RED.popover.tooltip(sidebarControls,RED._("keyboard.togglePalette"),"core:toggle-palette");
 
         sidebarControls.on("click", function() {
             RED.menu.toggleSelected("menu-item-palette");
         })
-        $("#palette").on("mouseenter", function() {
+        $("#red-ui-palette").on("mouseenter", function() {
             sidebarControls.toggle("slide", { direction: "left" }, 200);
         })
-        $("#palette").on("mouseleave", function() {
+        $("#red-ui-palette").on("mouseleave", function() {
             sidebarControls.hide();
         })
 
@@ -546,7 +554,10 @@ RED.palette = (function() {
             createCategoryContainer(category, category, "palette.label."+category);
         });
 
-        $("#palette-collapse-all").on("click", function(e) {
+
+        var paletteFooterButtons = $('<span class="button-group"></span>').appendTo("#red-ui-palette .red-ui-component-footer");
+        var paletteCollapseAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-up"></i></button>').appendTo(paletteFooterButtons);
+        paletteCollapseAll.on("click", function(e) {
             e.preventDefault();
             for (var cat in categoryContainers) {
                 if (categoryContainers.hasOwnProperty(cat)) {
@@ -554,9 +565,10 @@ RED.palette = (function() {
                 }
             }
         });
-        RED.popover.tooltip($("#palette-collapse-all"),RED._('palette.actions.collapse-all'));
+        RED.popover.tooltip(paletteCollapseAll,RED._('palette.actions.collapse-all'));
 
-        $("#palette-expand-all").on("click", function(e) {
+        var paletteExpandAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-down"></i></button>').appendTo(paletteFooterButtons);
+        paletteExpandAll.on("click", function(e) {
             e.preventDefault();
             for (var cat in categoryContainers) {
                 if (categoryContainers.hasOwnProperty(cat)) {
@@ -564,7 +576,7 @@ RED.palette = (function() {
                 }
             }
         });
-        RED.popover.tooltip($("#palette-expand-all"),RED._('palette.actions.expand-all'));
+        RED.popover.tooltip(paletteExpandAll,RED._('palette.actions.expand-all'));
 
         RED.actions.add("core:toggle-palette", function(state) {
             if (state === undefined) {
@@ -576,11 +588,11 @@ RED.palette = (function() {
     }
     function togglePalette(state) {
         if (!state) {
-            $("#main-container").addClass("palette-closed");
+            $("#main-container").addClass("red-ui-palette-closed");
             sidebarControls.hide();
             sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
         } else {
-            $("#main-container").removeClass("palette-closed");
+            $("#main-container").removeClass("red-ui-palette-closed");
             sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left");
         }
         setTimeout(function() { $(window).trigger("resize"); } ,200);
@@ -589,7 +601,7 @@ RED.palette = (function() {
 
     function getCategories() {
         var categories = [];
-        $("#palette-container .palette-category").each(function(i,d) {
+        $("#red-ui-palette-container .red-ui-palette-category").each(function(i,d) {
             categories.push({id:$(d).data('category'),label:$(d).data('label')});
         })
         return categories;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js b/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js
index 11732d211..8749a2a88 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js
@@ -2228,13 +2228,13 @@ RED.projects = (function() {
                     $(this).parent().find(".ui-dialog-titlebar-close").hide();
                     // $("#header-shade").show();
                     // $("#editor-shade").show();
-                    // $("#palette-shade").show();
+                    // $("#red-ui-palette-shade").show();
                     // $("#sidebar-shade").show();
                 },
                 close: function(e) {
                     // $("#header-shade").hide();
                     // $("#editor-shade").hide();
-                    // $("#palette-shade").hide();
+                    // $("#red-ui-palette-shade").hide();
                     // $("#sidebar-shade").hide();
                 }
             });
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
index 85bfbb31b..bdd9f138d 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js
@@ -213,7 +213,7 @@ RED.search = (function() {
                     }
                     nodeDiv.css('backgroundColor',colour);
 
-                    var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
+                    var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
                     RED.utils.createIconElement(icon_url, iconContainer, true);
 
                     var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
@@ -256,7 +256,7 @@ RED.search = (function() {
             RED.keyboard.add("*","escape",function(){hide()});
             $("#header-shade").show();
             $("#editor-shade").show();
-            $("#palette-shade").show();
+            $("#red-ui-palette-shade").show();
             $("#sidebar-shade").show();
             $("#sidebar-separator").hide();
             indexWorkspace();
@@ -277,7 +277,7 @@ RED.search = (function() {
             visible = false;
             $("#header-shade").hide();
             $("#editor-shade").hide();
-            $("#palette-shade").hide();
+            $("#red-ui-palette-shade").hide();
             $("#sidebar-shade").hide();
             $("#sidebar-separator").show();
             if (dialog !== null) {
@@ -301,7 +301,7 @@ RED.search = (function() {
 
         $("#header-shade").on('mousedown',hide);
         $("#editor-shade").on('mousedown',hide);
-        $("#palette-shade").on('mousedown',hide);
+        $("#red-ui-palette-shade").on('mousedown',hide);
         $("#sidebar-shade").on('mousedown',hide);
     }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js
index af62ab8e7..067d23175 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js
@@ -44,7 +44,7 @@ RED.sidebar.config = (function() {
     function getOrCreateCategory(name,parent,label) {
         name = name.replace(/\./i,"-");
         if (!categories[name]) {
-            var container = $('<div class="palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
+            var container = $('<div class="red-ui-palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
             var header = $('<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
             if (label) {
                 $('<span class="config-node-label"/>').text(label).appendTo(header);
@@ -52,7 +52,7 @@ RED.sidebar.config = (function() {
                 $('<span class="config-node-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
             }
             $('<span class="config-node-filter-info"></span>').appendTo(header);
-            category = $('<ul class="palette-content config-node-list"></ul>').appendTo(container);
+            category = $('<ul class="red-ui-palette-content config-node-list"></ul>').appendTo(container);
             container.i18n();
             var icon = header.find("i");
             var result = {
@@ -139,11 +139,11 @@ RED.sidebar.config = (function() {
                     currentType = node.type;
                 }
 
-                var entry = $('<li class="palette_node config_node palette_node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
+                var entry = $('<li class="red-ui-palette-node config_node red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
                 entry.data('node',node.id);
-                $('<div class="palette_label"></div>').text(label).appendTo(entry);
+                $('<div class="red-ui-palette-label"></div>').text(label).appendTo(entry);
                 if (node._def.hasUsers !== false) {
-                    var iconContainer = $('<div/>',{class:"palette_icon_container palette_icon_container_right"}).appendTo(entry);
+                    var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container red-ui-palette-icon-container-right"}).appendTo(entry);
                     if (node.users.length === 0) {
                         iconContainer.text(0);
                     } else {
@@ -163,7 +163,7 @@ RED.sidebar.config = (function() {
                     if (e.metaKey) {
                         $(this).toggleClass("selected");
                     } else {
-                        $(content).find(".palette_node").removeClass("selected");
+                        $(content).find(".red-ui-palette-node").removeClass("selected");
                         $(this).addClass("selected");
                     }
                     RED.sidebar.info.refresh(node);
@@ -246,11 +246,11 @@ RED.sidebar.config = (function() {
         });
         RED.actions.add("core:show-config-tab", function() {RED.sidebar.show('config')});
         RED.actions.add("core:select-all-config-nodes", function() {
-            $(content).find(".palette_node").addClass("selected");
+            $(content).find(".red-ui-palette-node").addClass("selected");
         })
         RED.actions.add("core:delete-config-selection", function() {
             var selectedNodes = [];
-            $(content).find(".palette_node.selected").each(function() {
+            $(content).find(".red-ui-palette-node.selected").each(function() {
                 selectedNodes.push($(this).data('node'));
             });
             if (selectedNodes.length > 0) {
@@ -296,7 +296,7 @@ RED.sidebar.config = (function() {
 
 
         RED.events.on("view:selection-changed",function() {
-            $(content).find(".palette_node").removeClass("selected");
+            $(content).find(".red-ui-palette-node").removeClass("selected");
         });
 
         $("#workspace-config-node-collapse-all").on("click", function(e) {
@@ -352,7 +352,7 @@ RED.sidebar.config = (function() {
             $('#workspace-config-node-filter-all').trigger("click");
             id = id.replace(/\./g,"-");
             setTimeout(function() {
-                var node = $(".palette_node_id_"+id);
+                var node = $(".red-ui-palette-node_id_"+id);
                 var y = node.position().top;
                 var h = node.height();
                 var scrollWindow = $(".sidebar-node-config");
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js
index b66288c43..f0f93070e 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js
@@ -268,12 +268,12 @@ RED.sidebar.info = (function() {
                                         var container = propRow.children()[1];
 
                                         var div = $('<span>',{class:""}).appendTo(container);
-                                        var nodeDiv = $('<div>',{class:"palette_node palette_node_small"}).appendTo(div);
+                                        var nodeDiv = $('<div>',{class:"red-ui-palette-node red-ui-palette-node-small"}).appendTo(div);
                                         var colour = RED.utils.getNodeColor(configNode.type,configNode._def);
                                         var icon_url = RED.utils.getNodeIcon(configNode._def);
                                         nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"});
-                                        var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
-                                        $('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
+                                        var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
+                                        $('<div/>',{class:"red-ui-palette-icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
                                         var nodeContainer = $('<span></span>').css({"verticalAlign":"top","marginLeft":"6px"}).text(configLabel).appendTo(container);
 
                                         nodeDiv.on('dblclick',function() {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/tray.js b/packages/node_modules/@node-red/editor-client/src/js/ui/tray.js
index af579fde2..a7c9c8d07 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/tray.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/tray.js
@@ -117,7 +117,7 @@ RED.tray = (function() {
         function finishBuild() {
             $("#header-shade").show();
             $("#editor-shade").show();
-            $("#palette-shade").show();
+            $("#red-ui-palette-shade").show();
             $(".sidebar-shade").show();
             tray.preferredWidth = Math.max(el.width(),500);
             if (!options.maximized) {
@@ -269,7 +269,7 @@ RED.tray = (function() {
                     if (stack.length === 0) {
                         $("#header-shade").hide();
                         $("#editor-shade").hide();
-                        $("#palette-shade").hide();
+                        $("#red-ui-palette-shade").hide();
                         $(".sidebar-shade").hide();
                         RED.events.emit("editor:close");
                         RED.view.focus();
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js b/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
index 544f66782..7a1a70dd0 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js
@@ -145,7 +145,7 @@ RED.typeSearch = (function() {
                 var icon_url = RED.utils.getNodeIcon(def);
                 nodeDiv.css('backgroundColor',colour);
 
-                var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
+                var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
                 RED.utils.createIconElement(icon_url, iconContainer, false);
 
                 if (def.inputs > 0) {
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
index 2d65c2fff..d2948ee68 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js
@@ -923,12 +923,12 @@ RED.utils = (function() {
      /**
       * Create or update an icon element and append it to iconContainer.
       * @param iconUrl - Url of icon.
-      * @param iconContainer - Icon container element with palette_icon_container class.
+      * @param iconContainer - Icon container element with red-ui-palette-icon-container class.
       * @param isLarge - Whether the icon size is large.
       */
     function createIconElement(iconUrl, iconContainer, isLarge) {
         // Removes the previous icon when icon was changed.
-        var iconElement = iconContainer.find(".palette_icon");
+        var iconElement = iconContainer.find(".red-ui-palette-icon");
         if (iconElement.length !== 0) {
             iconElement.remove();
         }
@@ -944,13 +944,13 @@ RED.utils = (function() {
             if (fontAwesomeUnicode) {
                 var faIconElement = $('<i/>').appendTo(iconContainer);
                 var faLarge = isLarge ? "fa-lg " : "";
-                faIconElement.addClass("palette_icon_fa fa fa-fw " + faLarge + iconPath.file);
+                faIconElement.addClass("red-ui-palette-icon-fa fa fa-fw " + faLarge + iconPath.file);
                 return;
             }
             // If the specified name is not defined in font-awesome, show arrow-in icon.
             iconUrl = RED.settings.apiRootUrl+"icons/node-red/arrow-in.png"
         }
-        var imageIconElement = $('<div/>',{class:"palette_icon"}).appendTo(iconContainer);
+        var imageIconElement = $('<div/>',{class:"red-ui-palette-icon"}).appendTo(iconContainer);
         imageIconElement.css("backgroundImage", "url("+iconUrl+")");
     }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
index aadfe239b..2bec92f81 100755
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/view.js
@@ -393,7 +393,7 @@ RED.view = (function() {
 
         // Handle nodes dragged from the palette
         $("#chart").droppable({
-            accept:".palette_node",
+            accept:".red-ui-palette-node",
             drop: function( event, ui ) {
                 d3.event = event;
                 var selected_tool = ui.draggable[0].type;
diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js b/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
index bd6bd2331..478a34001 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js
@@ -296,13 +296,13 @@ RED.workspaces = (function() {
                 if (selectedTabs.length === 0) {
                     $("#chart svg").css({"pointer-events":"auto",filter:"none"})
                     $("#workspace-toolbar").css({"pointer-events":"auto",filter:"none"})
-                    $("#palette-container").css({"pointer-events":"auto",filter:"none"})
+                    $("#red-ui-palette-container").css({"pointer-events":"auto",filter:"none"})
                     $(".sidebar-shade").hide();
                 } else {
                     RED.view.select(false)
                     $("#chart svg").css({"pointer-events":"none",filter:"opacity(60%)"})
                     $("#workspace-toolbar").css({"pointer-events":"none",filter:"opacity(60%)"})
-                    $("#palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
+                    $("#red-ui-palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
                     $(".sidebar-shade").show();
                 }
             },
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/diff.scss b/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
index 0a46364c6..fecdc5dc2 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/diff.scss
@@ -253,16 +253,16 @@
     background-size: contain;
     position: relative;
 
-    .palette_icon {
+    .red-ui-palette-icon {
         background-position: 49% 50%;
         width: 15px;
     }
-    .palette_icon_fa {
+    .red-ui-palette-icon-fa {
         position: relative;
         top: -2.5px;
         left: 0px;
     }
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         width: 18px;
     }
 }
@@ -410,10 +410,10 @@
         width: 18px;
         height: 15px;
     }
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         width: 18px;
     }
-    .palette_icon {
+    .red-ui-palette-icon {
         width: 15px;
     }
     ul,li,ol {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/editor.scss b/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
index 2d39cc108..76735c761 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/editor.scss
@@ -57,7 +57,7 @@
 .editor-tray-content {
     overflow: auto;
     position: relative;
-    .palette_icon_fa {
+    .red-ui-palette-icon-fa {
         top: 6px;
         left: 4px;
     }
@@ -154,7 +154,7 @@
     background: $background-color;
     color: $workspace-button-color;
 }
-#palette-shade, #editor-shade, #header-shade, #sidebar-shade  {
+#red-ui-palette-shade, #editor-shade, #header-shade, #sidebar-shade  {
     @include shade;
     z-index: 2;
 }
@@ -443,7 +443,7 @@
             border-color: white;
         }
     }
-    .palette_icon_fa {
+    .red-ui-palette-icon-fa {
         top: 6px;
         left: 3px;
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/palette.scss b/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
index a51c7c3e5..5be07764a 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/palette.scss
@@ -15,7 +15,7 @@
  **/
 
 
-#palette {
+#red-ui-palette{
     position: absolute;
     top: 0px;
     bottom: 0px;
@@ -28,29 +28,18 @@
     transition: width 0.2s ease-in-out;
 }
 
-.palette-closed {
-    #palette { width: 8px; }
-    #palette-search { display: none; }
-    #palette-container { display: none; }
-    #palette-footer { display: none; }
-}
-
-.palette-expanded {
-    & #palette {
-        width: 380px;
-        box-shadow: 1px 0 6px rgba(0,0,0,0.1);
+.red-ui-palette-closed {
+    #red-ui-palette {
+        width: 8px;
+        .red-ui-component-footer {
+            display: none;
+        }
     }
-    & #workspace { left: 379px !important; }
-    & #palette-collapse-all { display: none; }
-    & #palette-expand-all { display: none; }
-    & #palette-container { display: none !important; }
-    & #palette-search { display: none !important; }
-    & #palette-edit { background: $workspace-button-background-active }
-    & #palette-editor { display: block !important }
+    #red-ui-palette-search { display: none; }
+    #red-ui-palette-container { display: none; }
 }
 
-
-.palette-scroll {
+.red-ui-palette-scroll {
     position: absolute;
     top: 35px;
     right: 0;
@@ -60,10 +49,10 @@
     overflow-y: auto;
     box-sizing:border-box;
 }
-#palette > .palette-spinner {
+#red-ui-palette> .red-ui-palette-spinner {
     padding-top: 80px;
 }
-.palette-search {
+.red-ui-palette-search {
     position: relative;
     overflow: hidden;
     background: #ffffff;
@@ -74,15 +63,15 @@
     box-sizing:border-box;
 }
 
-.palette-category {
+.red-ui-palette-category {
     border-bottom: 1px solid #ccc;
 }
-.palette-content {
+.red-ui-palette-content {
     background: #fff;
     padding: 3px;
 }
 
-.palette-header {
+.red-ui-palette-header {
     position: relative;
     background: $palette-header-background;
     cursor: pointer;
@@ -96,7 +85,7 @@
         background: $palette-header-background !important;
     }
 }
-.palette-header > i {
+.red-ui-palette-header > i {
     position: absolute;
     left: 11px;
     top: 12px;
@@ -107,15 +96,15 @@
     -moz-transform: rotate(-90deg);
     -o-transform: rotate(-90deg);
 }
-.palette-header i.expanded {
+.red-ui-palette-header i.expanded {
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
 }
-.palette-header span {
+.red-ui-palette-header span {
     clear: both;
 }
-.palette_label {
+.red-ui-palette-label {
     font-size: 13px;
     margin: 4px 0 4px 32px;
     line-height: 20px;
@@ -123,11 +112,11 @@
     text-align: center;
     @include disable-selection;
 }
-.palette_label_right {
+.red-ui-palette-label-right {
     margin: 4px 32px 4px 0;
 }
 
-.palette_node {
+.red-ui-palette-node {
     display: block;
     cursor:move;
     background: #ddd;
@@ -141,11 +130,11 @@
     background-size: contain;
     position: relative;
 }
-.palette_node:hover {
+.red-ui-palette-node:hover {
     border-color: $node-selected-color;
     background-color: #eee;
 }
-.palette_port {
+.red-ui-palette-port {
     position: absolute;
     top:8px;
     left: -5px;
@@ -157,16 +146,16 @@
     height: 10px;
     border: 1px solid #999;
 }
-.palette_port_output {
+.red-ui-palette-port-output {
     left:auto;
     right: -6px;
 }
 
-.palette_node:hover .palette_port {
+.red-ui-palette-node:hover .red-ui-palette-port {
     border-color: #999;
     background-color: #eee;
 }
-.palette_icon_container {
+.red-ui-palette-icon-container {
     position: absolute;
     text-align: center;
     top:0;
@@ -176,13 +165,13 @@
     border-right: 1px solid rgba(0,0,0,0.1);
     background-color: rgba(0,0,0,0.05);
 }
-.palette_icon_container_right {
+.red-ui-palette-icon-container-right {
     left: auto;
     right: 0;
     border-right: none;
     border-left: 1px solid rgba(0,0,0,0.1);
 }
-.palette_icon {
+.red-ui-palette-icon {
     display: inline-block;
     width: 20px;
     height: 100%;
@@ -190,13 +179,13 @@
     background-size: contain;
     background-repeat: no-repeat;
 }
-.palette_icon_fa {
+.red-ui-palette-icon-fa {
     color: white;
     position: absolute;
     top: 7px;
     left: 3px;
 }
-.palette_node_small {
+.red-ui-palette-node-small {
     display: inline-block;
     position: relative;
     width: 18px;
@@ -205,15 +194,15 @@
     vertical-align: middle;
     cursor: default;
 
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         width: 18px;
         border-right: none;
     }
-    .palette_icon {
+    .red-ui-palette-icon {
         margin-left: -1px;
         width: 15px;
     }
-    .palette_icon_fa {
+    .red-ui-palette-icon-fa {
         top: 2px;
         left: 1px;
     }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/projects.scss b/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
index 3ef582bc3..96965fde5 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/projects.scss
@@ -283,7 +283,7 @@
     right: 0;
     overflow: hidden;
 
-    .palette-category {
+    .red-ui-palette-category {
         &:not(.palette-category-expanded) button {
             display: none;
         }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/search.scss b/packages/node_modules/@node-red/editor-client/src/sass/search.scss
index 3926d6f5f..692d4e9e2 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/search.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/search.scss
@@ -62,7 +62,7 @@
         font-size: 13px;
         border-left-width: 3px;
         border-right-width: 3px;
-        .palette_icon_fa {
+        .red-ui-palette-icon-fa {
             position: relative;
             top: -2.5px;
             left: 0px;
@@ -91,10 +91,10 @@
     .red-ui-search-result-node-output{
         left: 16px;
     }
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         width: 18px;
     }
-    .palette_icon {
+    .red-ui-palette-icon {
         width: 15px;
     }
     .red-ui-search-result-description {
@@ -150,7 +150,7 @@
         display: table;
         clear: both;
     }
-    .palette_icon_fa {
+    .red-ui-palette-icon-fa {
         top: 6px;
         left: 3px;
     }
@@ -169,7 +169,7 @@
     background-size: contain;
     position: relative;
 
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         border-right: none;
     }
 
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
index 78cd8628a..9b3a1b2f1 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss
@@ -25,7 +25,7 @@
 .config-node-list {
     margin: 0;
     list-style-type: none;
-    .palette_node {
+    .red-ui-palette-node {
         overflow: hidden;
         &.selected {
             border-color: $node-selected-color;
@@ -40,7 +40,7 @@
         overflow: hidden;
         text-overflow: ellipsis;
     }
-    .palette_icon_container {
+    .red-ui-palette-icon-container {
         font-size: 12px;
         line-height: 30px;
         background-color: #e8e8e8;
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss b/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
index 16404c136..4ccfe5f3f 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss
@@ -22,7 +22,7 @@
     right: 0;
     overflow-y: scroll;
 
-    .palette-category {
+    .red-ui-palette-category {
         &:not(.palette-category-expanded) button {
             display: none;
         }
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
index f76dbe32f..625bdafd1 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss
@@ -16,7 +16,7 @@
 
 .red-ui-stack {
     background: white;
-    .palette-category {
+    .red-ui-palette-category {
         background: white;
 
         &:last-child {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss b/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
index 9b2b750c7..d8b0aa0d6 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/workspace.scss
@@ -44,7 +44,7 @@
 
 }
 
-.palette-closed  #workspace {
+.red-ui-palette-closed  #workspace {
     left: 7px;
 }
 
diff --git a/packages/node_modules/@node-red/editor-client/templates/index.mst b/packages/node_modules/@node-red/editor-client/templates/index.mst
index c56c78e2a..23e420e29 100644
--- a/packages/node_modules/@node-red/editor-client/templates/index.mst
+++ b/packages/node_modules/@node-red/editor-client/templates/index.mst
@@ -51,18 +51,7 @@
         <div id="editor-shade" class="hide"></div>
     </div>
     <div id="editor-stack"></div>
-    <div id="palette">
-        <img src="red/images/spin.svg" class="palette-spinner hide"/>
-        <div id="palette-search" class="palette-search hide">
-            <input type="text" data-i18n="[placeholder]palette.filter"></input>
-        </div>
-        <div id="palette-container" class="palette-scroll hide"></div>
-        <div id="palette-footer" class="red-ui-component-footer">
-            <a class="red-ui-footer-button" id="palette-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a>
-            <a class="red-ui-footer-button" id="palette-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>
-        </div>
-        <div id="palette-shade" class="hide"></div>
-    </div><!-- /palette -->
+    <div id="red-ui-palette"></div>
     <div id="sidebar">
         <ul id="sidebar-tabs"></ul>
         <div id="sidebar-content"></div>
diff --git a/packages/node_modules/@node-red/nodes/core/core/60-link.html b/packages/node_modules/@node-red/nodes/core/core/60-link.html
index efdc5012b..958abacb9 100644
--- a/packages/node_modules/@node-red/nodes/core/core/60-link.html
+++ b/packages/node_modules/@node-red/nodes/core/core/60-link.html
@@ -53,7 +53,7 @@
         if (activeSubflow) {
             flowMap[activeSubflow.id] = {
                 id: activeSubflow.id,
-                class: 'palette-header',
+                class: 'red-ui-palette-header',
                 label:  "Subflow : "+(activeSubflow.name || activeSubflow.id),
                 expanded: true,
                 children: []
@@ -63,7 +63,7 @@
             RED.nodes.eachWorkspace(function(ws) {
                 flowMap[ws.id] = {
                     id: ws.id,
-                    class: 'palette-header',
+                    class: 'red-ui-palette-header',
                     label: (ws.label || ws.id)+(node.z===ws.id ? " *":""),
                     expanded: true,
                     children: []