diff --git a/common/content/commandline.js b/common/content/commandline.js
index a029695e..f0fc5e7f 100644
--- a/common/content/commandline.js
+++ b/common/content/commandline.js
@@ -1779,8 +1779,6 @@ const ItemList = Class("ItemList", {
         this._doc.body.appendChild(this._doc.createTextNode(""));
         this._doc.body.style.borderTop = "1px solid black"; // FIXME: For cases where completions/MOW are shown at once, or ls=0. Should use :highlight.
 
-        this._gradient = template.gradient("GradientLeft", "GradientRight");
-
         this._items = null;
         this._startIndex = -1; // The index of the first displayed item
         this._endIndex = -1;   // The index one *after* the last displayed item
@@ -1839,7 +1837,7 @@ const ItemList = Class("ItemList", {
                     <div highlight="Completions">
                         { context.createRow(context.title || [], "CompTitle") }
                     </div>
-                    { this._gradient }
+                    <div highlight="CompTitleSep"/>
                     <div key="message" highlight="CompMsg"/>
                     <div key="up" highlight="CompLess"/>
                     <div key="items" highlight="Completions"/>
diff --git a/common/content/configbase.js b/common/content/configbase.js
index ddd06762..ebf9d0c7 100644
--- a/common/content/configbase.js
+++ b/common/content/configbase.js
@@ -207,6 +207,7 @@ const ConfigBase = Class(ModuleBase, {
         CompGroup:not(:first-of-type)  margin-top: .5em;
         CompTitle            color: magenta; background: white; font-weight: bold;
         CompTitle>*          padding: 0 .5ex;
+        CompTitleSep         height: 1px; background: magenta; background: -moz-linear-gradient(60deg, magenta, white);
         CompMsg              font-style: italic; margin-left: 16px;
         CompItem
         CompItem:nth-child(2n+1)    background: rgba(0, 0, 0, .04);
@@ -222,10 +223,6 @@ const ConfigBase = Class(ModuleBase, {
         CompMore::after      content: "⌄";
         CompGroup:last-of-type  padding-bottom: 1.5ex;
 
-        Gradient        height: 1px; margin-bottom: -1px; margin-top: -1px;
-        GradientLeft    background-color: magenta;
-        GradientRight   background-color: white;
-
         Indicator   color: blue; width: 1.5em; text-align: center;
         Filter      font-weight: bold;
 
diff --git a/common/modules/template.jsm b/common/modules/template.jsm
index 3defab82..3d330bcb 100644
--- a/common/modules/template.jsm
+++ b/common/modules/template.jsm
@@ -78,21 +78,6 @@ const Template = Module("Template", {
         // </e4x>
     },
 
-    gradient: function (left, right)
-        <div highlight="Gradient">
-            <div style="height: 0px">
-                <div highlight={right + " Gradient"}
-                     style="border: 0 !important; margin: 0 !important; padding: 0 !important;"/>
-            </div>
-            <table width="100%" style="height: 100%">
-                <tr>
-                    { template.map(util.range(0, 100), function (i)
-                      <td highlight={left} style={"opacity: " + (1 - i / 100)}
-                      />) }
-                </tr>
-            </table>
-        </div>,
-
     // if "processStrings" is true, any passed strings will be surrounded by " and
     // any line breaks are displayed as \n
     highlight: function highlight(arg, processStrings, clip) {