diff --git a/css/map.css b/css/map.css
index f2869edaa..1c0d6298a 100644
--- a/css/map.css
+++ b/css/map.css
@@ -29,12 +29,10 @@ use {
 
 /* points */
 
-g.point circle {
-    fill:#fff;
-}
-
-g.point image {
-  pointer-events: none;
+g.point .stroke {
+    stroke: #444;
+    stroke-width: 1;
+    fill: #fff;
 }
 
 g.point .shadow {
@@ -44,13 +42,17 @@ g.point .shadow {
     transition: transform 100ms linear;
     -moz-transition: fill 100ms linear;
 }
+
 .behavior-hover g.point.hover:not(.selected) .shadow {
-    fill: #f6634f;
-    fill-opacity: 0.5;
+    stroke-width: 8;
+    stroke: #f6634f;
+    stroke-opacity: 0.5;
 }
+
 g.point.selected .shadow {
-    fill: #f6634f;
-    fill-opacity: 0.7;
+    stroke-width: 8;
+    stroke: #f6634f;
+    stroke-opacity: 0.7;
 }
 
 g.point.active, g.point.active * {
diff --git a/js/id/svg/labels.js b/js/id/svg/labels.js
index ac702ec44..db61b91e9 100644
--- a/js/id/svg/labels.js
+++ b/js/id/svg/labels.js
@@ -41,9 +41,9 @@ iD.svg.Labels = function(projection) {
     });
 
     var pointOffsets = [
-        [15, 2, 'start'], // right
-        [10, 0, 'start'], // unused right now
-        [-15, 0, 'end']
+        [15, -11, 'start'], // right
+        [10, -11, 'start'], // unused right now
+        [-15, -11, 'end']
     ];
 
     var lineOffsets = [50, 45, 55, 40, 60, 35, 65, 30, 70, 25,
diff --git a/js/id/svg/points.js b/js/id/svg/points.js
index 1e50cf407..f7908a078 100644
--- a/js/id/svg/points.js
+++ b/js/id/svg/points.js
@@ -1,11 +1,12 @@
 iD.svg.Points = function(projection, context) {
-    return function drawPoints(surface, graph, entities, filter) {
-        function imageHref(entity) {
-            var preset = context.presets()
-                .match(entity, context.graph());
-            return '#maki-' + preset.icon + '-12';
-        }
+    function markerPath(selection, klass) {
+        selection
+            .attr('class', klass)
+            .attr('transform', 'translate(-8, -23)')
+            .attr('d', 'M 17,8 C 17,13 11,21 8.5,23.5 C 6,21 0,13 0,8 C 0,4 4,-0.5 8.5,-0.5 C 13,-0.5 17,4 17,8 z');
+    }
 
+    return function drawPoints(surface, graph, entities, filter) {
         var points = [];
 
         for (var i = 0; i < entities.length; i++) {
@@ -27,16 +28,15 @@ iD.svg.Points = function(projection, context) {
             .append('g')
             .attr('class', 'node point');
 
-        group.append('circle')
-            .attr('r', 12)
-            .attr('class', 'shadow');
+        group.append('path')
+            .call(markerPath, 'shadow');
 
-        group.append('circle')
-            .attr('class', 'stroke')
-            .attr('r', 8);
+        group.append('path')
+            .call(markerPath, 'stroke');
 
         group.append('use')
-            .attr('transform', 'translate(-6, -6)')
+            .attr('class', 'icon')
+            .attr('transform', 'translate(-6, -20)')
             .attr('clip-path', 'url(#clip-square-12)');
 
         groups.attr('transform', iD.svg.PointTransform(projection))
@@ -45,10 +45,17 @@ iD.svg.Points = function(projection, context) {
 
         // Selecting the following implicitly
         // sets the data (point entity) on the element
-        groups.select('use')
-            .attr('xlink:href', imageHref);
         groups.select('.shadow');
         groups.select('.stroke');
+        groups.select('.icon')
+            .attr('xlink:href', function imageHref(entity) {
+                var preset = context.presets().match(entity, graph);
+                if (preset.icon === 'marker-stroked') {
+                    return '';
+                } else {
+                    return '#maki-' + preset.icon + '-12';
+                }
+            });
 
         groups.exit()
             .remove();
diff --git a/test/rendering.html b/test/rendering.html
index dfada7ba5..919079fd3 100644
--- a/test/rendering.html
+++ b/test/rendering.html
@@ -63,6 +63,12 @@
         context.presets = function() {
             return iD.presets().load({
                 presets: [{
+                    geometry: ['point'],
+                    tags: {
+                        amenity: 'restaurant'
+                    },
+                    icon: 'restaurant'
+                }, {
                     geometry: ['vertex'],
                     tags: {
                         highway: 'turning_circle'
@@ -77,6 +83,57 @@
                 }]
             });
         };
+
+        function tagHTML(d) {
+            return _.map(d, function (value, key) { return key + "=" + value;}).join("<br>");
+        }
+    </script>
+
+    <table>
+        <thead>
+            <tr><th></th><th>Base</th><th>Hover</th><th>Selected</th></tr>
+        </thead>
+        <tbody class="points">
+        </tbody>
+    </table>
+
+    <script>
+        var data = [{}, {amenity: 'restaurant'}],
+            modes = ['base', 'hover', 'selected'],
+            node = iD.Node({loc: [15, 30]}),
+            points = iD.svg.Points(projection, context);
+
+        var row = d3.select('.points').selectAll('tr')
+            .data(data)
+          .enter().append('tr');
+
+        row.append('th')
+            .html(tagHTML);
+
+        row.selectAll('td')
+            .data(function (d) {
+                return modes.map(function (m) {
+                    return _.extend({ mode: m }, d);
+                });
+            })
+          .enter()
+            .append('td')
+            .attr('class', function (d) { return d.mode === 'selected' ? 'mode-select' : 'mode-browse'; })
+            .append('svg')
+            .attr('width', 30)
+            .attr('height', 40)
+            .attr('data-zoom', function (d) { return d.zoom; })
+            .call(iD.svg.Surface())
+            .each(function (d) {
+                var n = node.update({tags: d}),
+                    graph = iD.Graph([n]);
+
+                d3.select(this)
+                    .attr('class', 'behavior-hover')
+                    .call(points, graph, [n], filter)
+                    .selectAll('.point')
+                    .classed(d.mode, d.mode !== 'base');
+            });
     </script>
 
     <table>
@@ -84,7 +141,7 @@
             <tr><th></th><th colspan="3">z16</th><th colspan="3">z17</th><th colspan="3">z18</th></tr>
             <tr><th></th><th>Base</th><th>Hover</th><th>Selected</th><th>Base</th><th>Hover</th><th>Selected</th><th>Base</th><th>Hover</th><th>Selected</th></tr>
         </thead>
-        <tbody class="points">
+        <tbody class="vertices">
         </tbody>
     </table>
 
@@ -109,7 +166,7 @@
             way = iD.Way({nodes: [node.id]}),
             vertices = iD.svg.Vertices(projection, context);
 
-        var row = d3.select('.points').selectAll('tr')
+        var row = d3.select('.vertices').selectAll('tr')
             .data(data)
           .enter().append('tr');
 
@@ -143,7 +200,6 @@
                     .classed(d.mode, d.mode !== 'base')
                     .classed('shared', d.shared);
             });
-
     </script>
 
     <table>
@@ -196,7 +252,7 @@
           .enter().append('tr');
 
         row.append('th')
-            .html(function (d) { return _.map(d, function (value, key) { return key + "=" + value;}).join("<br>"); });
+            .html(tagHTML);
 
         var a = iD.Node({loc: [15, 15]}),
             b = iD.Node({loc: [185, 15]}),