diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/macro.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/macro.resource.js
index a5d960a9ec..73a1651b5e 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/macro.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/macro.resource.js
@@ -115,6 +115,12 @@ function macroResource($q, $http, umbRequestHelper) {
             return umbRequestHelper.resourcePromise(
                 $http.post(umbRequestHelper.getApiUrl("macroApiBaseUrl", "Save"), macro)
             );
+        },
+
+        deleteById: function(id) {
+            return umbRequestHelper.resourcePromise(
+                $http.post(umbRequestHelper.getApiUrl("macroApiBaseUrl", "deleteById", { "id": id }))
+            );
         }
 };
 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/macros/delete.html b/src/Umbraco.Web.UI.Client/src/views/macros/delete.html
new file mode 100644
index 0000000000..2d097e110b
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/macros/delete.html
@@ -0,0 +1,10 @@
+<div class="umb-dialog umb-pane" ng-controller="Umbraco.Editors.Macros.DeleteController as vm">
+    <div class="umb-dialog-body" auto-scale="90">
+
+        <p class="umb-abstract">
+            <localize key="defaultdialogs_confirmdelete">Are you sure you want to delete</localize> <strong>{{vm.name}}</strong> ?
+        </p>
+
+        <umb-confirm on-confirm="vm.performDelete" on-cancel="cancel"></umb-confirm>
+    </div>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/macros/macros.delete.controller.js b/src/Umbraco.Web.UI.Client/src/views/macros/macros.delete.controller.js
new file mode 100644
index 0000000000..1aadef9f31
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/macros/macros.delete.controller.js
@@ -0,0 +1,32 @@
+/**
+ * @ngdoc controller
+ * @name Umbraco.Editors.Macros.DeleteController
+ * @function
+ * 
+ * @description
+ * The controller for deleting macro items
+ */
+function MacrosDeleteController($scope, $location, macroResource, navigationService, treeService) {
+    var vm = this;
+    
+    vm.name = $scope.currentNode.name;
+    function performDelete() {
+        $scope.currentNode.loading = true;
+        macroResource.deleteById($scope.currentNode.id).then(function () {
+            $scope.currentNode.loading = false;
+
+            treeService.removeNode($scope.currentNode);
+            
+            navigationService.hideMenu();
+        });
+    }
+
+    function cancel() {
+        navigationService.hideDialog();
+    }
+    
+    vm.performDelete = performDelete;
+    vm.cancel = cancel;
+}
+
+angular.module("umbraco").controller("Umbraco.Editors.Macros.DeleteController", MacrosDeleteController);
diff --git a/src/Umbraco.Web/Editors/MacrosController.cs b/src/Umbraco.Web/Editors/MacrosController.cs
index 5ff2f7bf34..4c198ea6b3 100644
--- a/src/Umbraco.Web/Editors/MacrosController.cs
+++ b/src/Umbraco.Web/Editors/MacrosController.cs
@@ -115,6 +115,22 @@
             return this.Request.CreateResponse(HttpStatusCode.OK, macroDisplay);
         }
 
+
+        [HttpPost]
+        public HttpResponseMessage DeleteById(int id)
+        {
+            var macro = this.Services.MacroService.GetById(id);
+
+            if (macro == null)
+            {
+                return this.ReturnErrorResponse($"Macro with id {id} does not exist");
+            }
+
+            this.Services.MacroService.Delete(macro);
+
+            return Request.CreateResponse(HttpStatusCode.OK);
+        }
+
         [HttpPost]
         public HttpResponseMessage Save(MacroDisplay macroDisplay)
         {
diff --git a/src/Umbraco.Web/Trees/MacrosTreeController.cs b/src/Umbraco.Web/Trees/MacrosTreeController.cs
index cdbe4bfcf7..0300dbd6c6 100644
--- a/src/Umbraco.Web/Trees/MacrosTreeController.cs
+++ b/src/Umbraco.Web/Trees/MacrosTreeController.cs
@@ -54,7 +54,7 @@ namespace Umbraco.Web.Trees
             {
                 //Create the normal create action
                 menu.Items.Add<ActionNew>(Services.TextService);
-                    
+
                 //refresh action
                 menu.Items.Add(new RefreshNode(Services.TextService, true));
 
@@ -65,16 +65,7 @@ namespace Umbraco.Web.Trees
             if (macro == null) return new MenuItemCollection();
 
             //add delete option for all macros
-            menu.Items.Add<ActionDelete>(Services.TextService, opensDialog: true)
-                //Since we haven't implemented anything for macros in angular, this needs to be converted to
-                //use the legacy format
-                .ConvertLegacyMenuItem(new EntitySlim
-                {
-                    Id = macro.Id,
-                    Level = 1,
-                    ParentId = -1,
-                    Name = macro.Name
-                }, "macros", queryStrings.GetValue<string>("application"));
+            menu.Items.Add<ActionDelete>(Services.TextService, opensDialog: true);
 
             return menu;
         }