diff --git a/css/app.css b/css/app.css
index 60b403711..e8b75abe3 100644
--- a/css/app.css
+++ b/css/app.css
@@ -703,25 +703,25 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
 
 /* Preset grid  */
 
-.preset-grid  {
+.preset-list  {
     width:100%;
     padding: 20px 20px 10px 20px;
     border-bottom: 1px solid #ccc;
 }
 
-.grid-button-wrap {
+.preset-list-button-wrap {
     margin-bottom: 10px;
     height: 60px;
 }
 
-.grid-entry {
+.preset-list-button {
     width: 100%;
     height: 100%;
     position: relative;
     border: 1px solid #ccc;
 }
 
-.preset-grid.filtered .grid-button-wrap:first-child .grid-entry {
+.preset-list.filtered .preset-list-item:first-child .preset-list-button {
     background: #ececec;
 }
 
@@ -737,7 +737,7 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     left: 0;
 }
 
-.grid-entry .label {
+.preset-list-button .label {
     background-color: #f6f6f6;
     text-align: left;
     position: absolute;
@@ -757,11 +757,11 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     border-radius: 0 3px 3px 0;
     }
 
-.grid-entry:hover .label {
+.preset-list-button:hover .label {
     background-color: #ececec;
 }
 
-.grid-button-wrap button.tag-reference-button {
+.preset-list-item button.tag-reference-button {
     float: right;
     position: static;
     margin-top: -60px;
@@ -770,13 +770,13 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     border-radius: 0 3px 3px 0;
 }
 
-.current .grid-entry,
-.current .grid-entry .label {
+.current .preset-list-button,
+.current .preset-list-button .label {
     background-color: #E8EBFF;
 }
 
-.category .grid-entry:after,
-.category .grid-entry:before {
+.category .preset-list-button:after,
+.category .preset-list-button:before {
     content: "";
     position: absolute;
     top: -5px;
@@ -787,11 +787,11 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     height: 6px;
 }
 
-.category .grid-entry:before {
+.category .preset-list-button:before {
     top: -3px;
 }
 
-.preset-grid-search-wrap .icon {
+.grid-pane .preset-search-icon {
     display: block;
     position: absolute;
     left: 10px;
@@ -799,7 +799,7 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     pointer-events: none;
 }
 
-.preset-grid-search-wrap input {
+.grid-pane .preset-search-input {
     position: absolute;
     top: 60px;
     border-radius: 0;
@@ -808,7 +808,7 @@ a:hover .icon.out-link   { background-position: -500px -14px;}
     text-indent: 30px;
 }
 
-.subgrid .preset-grid {
+.subgrid .preset-list {
     padding: 10px 10px 0 10px;
     border: 1px solid #CCC;
     margin-top: 0;
diff --git a/js/id/ui/intro/area.js b/js/id/ui/intro/area.js
index 112283735..72561a19c 100644
--- a/js/id/ui/intro/area.js
+++ b/js/id/ui/intro/area.js
@@ -52,17 +52,17 @@ iD.ui.intro.area = function(context, reveal) {
             context.on('enter.intro', null);
 
             timeout = setTimeout(function() {
-                reveal('.preset-grid-search-wrap input', 'intro.areas.search');
-                d3.select('.preset-grid-search-wrap input').on('keyup.intro', keySearch);
+                reveal('.preset-search-input', 'intro.areas.search');
+                d3.select('.preset-search-input').on('keyup.intro', keySearch);
             }, 500);
         }
 
         function keySearch() {
-            var first = d3.select('.grid-button-wrap:first-child');
-            if (first.datum().id === 'leisure/playground') {
-                reveal(first.select('.grid-entry').node(), 'intro.areas.choose');
+            var first = d3.select('.preset-list-item:first-child');
+            if (first.classed('preset-leisure-playground')) {
+                reveal(first.select('.preset-list-button').node(), 'intro.areas.choose');
                 d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
-                d3.select('.preset-grid-search-wrap input').on('keyup.intro', null);
+                d3.select('.preset-search-input').on('keyup.intro', null);
             }
         }
 
@@ -78,7 +78,7 @@ iD.ui.intro.area = function(context, reveal) {
         context.on('exit.intro', null);
         context.history().on('change.intro', null);
         context.map().on('move.intro', null);
-        d3.select('.preset-grid-search-wrap input').on('keyup.intro', null);
+        d3.select('.preset-search-input').on('keyup.intro', null);
     };
 
     return d3.rebind(step, event, 'on');
diff --git a/js/id/ui/intro/line.js b/js/id/ui/intro/line.js
index 96c75d280..ac702dc12 100644
--- a/js/id/ui/intro/line.js
+++ b/js/id/ui/intro/line.js
@@ -97,7 +97,7 @@ iD.ui.intro.line = function(context, reveal) {
 
             timeout(function() {
                 d3.select('#curtain').style('pointer-events', 'none');
-                var road = d3.select('.preset-grid .grid-entry').filter(function(d) {
+                var road = d3.select('.preset-list .preset-list-button').filter(function(d) {
                     return d.id === 'category-road';
                 });
                 reveal(road.node(), 'intro.lines.road');
@@ -109,7 +109,7 @@ iD.ui.intro.line = function(context, reveal) {
             timeout(function() {
                 var grid = d3.select('.subgrid');
                 reveal(grid.node(),  'intro.lines.residential');
-                grid.selectAll('.grid-entry').filter(function(d) {
+                grid.selectAll('.preset-list-button').filter(function(d) {
                     return d.id === 'highway/residential';
                 }).one('click.intro', roadDetails);
             }, 200);
diff --git a/js/id/ui/intro/point.js b/js/id/ui/intro/point.js
index a8445232c..6a4cecb81 100644
--- a/js/id/ui/intro/point.js
+++ b/js/id/ui/intro/point.js
@@ -40,18 +40,18 @@ iD.ui.intro.point = function(context, reveal) {
             context.on('enter.intro', null);
 
             setTimeout(function() {
-                reveal('.preset-grid-search-wrap input', 'intro.points.search');
-                d3.select('.preset-grid-search-wrap input').on('keyup.intro', keySearch);
+                reveal('.preset-search-input', 'intro.points.search');
+                d3.select('.preset-search-input').on('keyup.intro', keySearch);
             }, 500);
         }
 
         function keySearch() {
-            var first = d3.select('.grid-button-wrap:first-child');
-            if (first.datum().id === 'amenity/cafe') {
-                reveal(first.select('.grid-entry').node(), 'intro.points.choose');
+            var first = d3.select('.preset-list-item:first-child');
+            if (first.classed('preset-amenity-cafe')) {
+                reveal(first.select('.preset-list-button').node(), 'intro.points.choose');
                 d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
 
-                d3.select('.preset-grid-search-wrap input').on('keydown.intro', function() {
+                d3.select('.preset-search-input').on('keydown.intro', function() {
                     // Prevent search from updating and changing the grid
                     d3.event.stopPropagation();
                     d3.event.preventDefault();
@@ -68,7 +68,7 @@ iD.ui.intro.point = function(context, reveal) {
         }
 
         function closeEditor() {
-            d3.select('.preset-grid-search-wrap input').on('keydown.intro', null);
+            d3.select('.preset-search-input').on('keydown.intro', null);
             context.history().on('change.intro', null);
             reveal('.tag-pane', 'intro.points.close');
         }
@@ -138,7 +138,7 @@ iD.ui.intro.point = function(context, reveal) {
         context.on('enter.intro', null);
         context.map().on('move.intro', null);
         context.history().on('change.intro', null);
-        d3.select('.preset-grid-search-wrap input').on('keyup.intro', null).on('keydown.intro', null);
+        d3.select('.preset-search-input').on('keyup.intro', null).on('keydown.intro', null);
     };
 
     return d3.rebind(step, event, 'on');
diff --git a/js/id/ui/preset_list.js b/js/id/ui/preset_list.js
index 32f209b8c..3d01da4bd 100644
--- a/js/id/ui/preset_list.js
+++ b/js/id/ui/preset_list.js
@@ -53,57 +53,57 @@ iD.ui.PresetList = function(context, entity) {
             // enter
             var value = search.property('value');
             if (d3.event.keyCode === 13 && value.length) {
-                grid.selectAll('.grid-entry:first-child').datum().choose();
+                list.selectAll('.preset-list-item:first-child').datum().choose();
             } else {
-                grid.classed('filtered', value.length);
+                list.classed('filtered', value.length);
                 if (value.length) {
                     var results = presets.search(value);
                     message.text(t('inspector.results', {
                         n: results.collection.length,
                         search: value
                     }));
-                    grid.call(drawGrid, results);
+                    list.call(drawList, results);
                 } else {
-                    grid.call(drawGrid, context.presets().defaults(geometry, 36));
+                    list.call(drawList, context.presets().defaults(geometry, 36));
                 }
             }
         }
 
-        var searchwrap = selection.append('div')
-            .attr('class', 'preset-grid-search-wrap');
+        var searchWrap = selection.append('div')
+            .attr('class', 'preset-search');
 
-        var search = searchwrap.append('input')
-            .attr('class', 'major')
+        var search = selection.append('input')
+            .attr('class', 'preset-search-input major')
             .attr('placeholder', t('inspector.search'))
             .attr('type', 'search')
             .on('keydown', keydown)
             .on('keyup', keyup);
 
-        searchwrap.append('span')
-            .attr('class', 'icon search');
+        searchWrap.append('span')
+            .attr('class', 'preset-search-icon icon search');
 
         if (autofocus) {
             search.node().focus();
         }
 
-        var gridwrap = selection.append('div')
+        var listWrap = selection.append('div')
             .attr('class', 'fillL2 inspector-body inspector-body-' + geometry);
 
-        var grid = gridwrap.append('div')
-            .attr('class', 'preset-grid fillL cf')
-            .call(drawGrid, context.presets().defaults(geometry, 36));
+        var list = listWrap.append('div')
+            .attr('class', 'preset-list fillL cf')
+            .call(drawList, context.presets().defaults(geometry, 36));
     }
 
-    function drawGrid(grid, presets) {
+    function drawList(list, presets) {
         var collection = presets.collection.map(function(preset) {
             return preset.members ? CategoryItem(preset) : PresetItem(preset)
         });
 
-        var items = grid.selectAll('.preset-item')
+        var items = list.selectAll('.preset-list-item')
             .data(collection, function(d) { return d.preset.id; });
 
         items.enter().append('div')
-            .attr('class', 'preset-item')
+            .attr('class', function(item) { return 'preset-list-item preset-' + item.preset.id.replace('/', '-'); })
             .classed('current', function(item) { return item.preset === current; })
             .each(function(item) {
                 d3.select(this).call(item);
@@ -119,15 +119,15 @@ iD.ui.PresetList = function(context, entity) {
     }
 
     function CategoryItem(preset) {
-        var box, subgrid, shown = false;
+        var box, sublist, shown = false;
 
         function item(selection) {
             var wrap = selection.append('div')
-                .attr('class', 'grid-button-wrap category col12');
+                .attr('class', 'preset-list-button-wrap category col12');
 
             wrap.append('button')
                 .datum(preset)
-                .attr('class', 'grid-entry')
+                .attr('class', 'preset-list-button')
                 .call(iD.ui.PresetIcon(context.geometry(entity.id)))
                 .on('click', item.choose)
                 .append('div')
@@ -141,8 +141,8 @@ iD.ui.PresetList = function(context, entity) {
             box.append('div')
                 .attr('class', 'arrow');
 
-            subgrid = box.append('div')
-                .attr('class', 'preset-grid fillL3 cf fl');
+            sublist = box.append('div')
+                .attr('class', 'preset-list fillL3 cf fl');
         }
 
         item.choose = function() {
@@ -155,7 +155,7 @@ iD.ui.PresetList = function(context, entity) {
                     .style('padding-bottom', '0');
             } else {
                 shown = true;
-                subgrid.call(drawGrid, preset.members);
+                sublist.call(drawList, preset.members);
                 box.transition()
                     .duration(200)
                     .style('opacity', '1')
@@ -172,11 +172,11 @@ iD.ui.PresetList = function(context, entity) {
     function PresetItem(preset) {
         function item(selection) {
             var wrap = selection.append('div')
-                .attr('class', 'grid-button-wrap col12');
+                .attr('class', 'preset-list-button-wrap col12');
 
             wrap.append('button')
                 .datum(preset)
-                .attr('class', 'grid-entry')
+                .attr('class', 'preset-list-button')
                 .call(iD.ui.PresetIcon(context.geometry(entity.id)))
                 .on('click', item.choose)
                 .append('div')