diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbclipboard.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbclipboard.directive.js
index 575b5bd698..7c73e62301 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbclipboard.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbclipboard.directive.js
@@ -94,51 +94,53 @@
 (function () {
     'use strict';
 
-    function umbClipboardDirective($timeout, assetsService) {
+    function umbClipboardDirective($timeout, assetsService, $parse) {
 
         function link(scope, element, attrs, ctrl) {
 
             var clipboard;
             var target = element[0];
-            
+
             assetsService.loadJs("lib/clipboard/clipboard.min.js", scope)
                 .then(function () {
 
-                    if(scope.umbClipboardTarget) {
-                        target.setAttribute("data-clipboard-target", scope.umbClipboardTarget);
+
+                    if (attrs.umbClipboardTarget) {
+                        target.setAttribute("data-clipboard-target", attrs.umbClipboardTarget);
                     }
 
-                    if(scope.umbClipboardAction) {
-                        target.setAttribute("data-clipboard-action", scope.umbClipboardAction);
+                    if (attrs.umbClipboardAction) {
+                        target.setAttribute("data-clipboard-action", attrs.umbClipboardAction);
                     }
 
-                    if(scope.umbClipboardText) {
-                        target.setAttribute("data-clipboard-text", scope.umbClipboardText);
+                    if (attrs.umbClipboardText) {
+                        target.setAttribute("data-clipboard-text", attrs.umbClipboardText);
                     }
 
-                    clipboard = new Clipboard(target);
+                    clipboard = new ClipboardJS(target);
 
+                    var expressionHandlerSuccess = $parse(attrs.umbClipboardSuccess);
                     clipboard.on('success', function (e) {
                         e.clearSelection();
-                        if (scope.umbClipboardSuccess) {
-                            scope.$apply(function () {
-                                scope.umbClipboardSuccess({ e: e });
-                            });
+                        if (attrs.umbClipboardSuccess) {
+
+                            expressionHandlerSuccess(scope, { msg: "success" });
                         }
+
                     });
 
+                    var expressionHandlerError = $parse(attrs.umbClipboardError);
                     clipboard.on('error', function (e) {
-                        if (scope.umbClipboardError) {
-                            scope.$apply(function () {
-                                scope.umbClipboardError({ e: e });
-                            });
+                        if (attrs.umbClipboardError) {
+
+                            expressionHandlerError(scope, { msg: "error" });
                         }
                     });
 
                 });
 
             // clean up
-            scope.$on('$destroy', function(){
+            scope.$on('$destroy', function () {
                 clipboard.destroy();
             });
 
@@ -148,13 +150,6 @@
 
         var directive = {
             restrict: 'A',
-            scope: {
-                umbClipboardSuccess: '&?',
-                umbClipboardError: '&?',
-                umbClipboardTarget: "@?",
-                umbClipboardAction: "@?",
-                umbClipboardText: "=?"
-            },
             link: link
         };
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js
index c3cee9292c..3c5c083477 100644
--- a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js
@@ -69,7 +69,7 @@
         if (Umbraco.Sys.ServerVariables.umbracoSettings.showUserInvite) {
             vm.defaultButton = {
                 labelKey: "user_inviteUser",
-                handler: function() {
+                handler: function () {
                     vm.setUsersViewState('inviteUser');
                 }
             };
@@ -135,7 +135,7 @@
             getUsers();
 
             // Get user groups
-            userGroupsResource.getUserGroups({ onlyCurrentUserGroups: false}).then(function (userGroups) {
+            userGroupsResource.getUserGroups({ onlyCurrentUserGroups: false }).then(function (userGroups) {
                 vm.userGroups = userGroups;
             });
 
@@ -540,12 +540,32 @@
 
         // copy to clip board success
         function copySuccess() {
-            vm.page.copyPasswordButtonState = "success";
+
+            if (vm.page.copyPasswordButtonState != "success") {
+
+                vm.page.copyPasswordButtonState = "success";
+
+                $timeout(function () {
+                    resetClipboardButtonState()
+                }, 1000);
+            }
+
         }
 
         // copy to clip board error
         function copyError() {
-            vm.page.copyPasswordButtonState = "error";
+            if (vm.page.copyPasswordButtonState != "error") {
+
+                vm.page.copyPasswordButtonState = "error";
+
+                $timeout(function () {
+                    resetClipboardButtonState()
+                }, 1000);
+            }
+        }
+
+        function resetClipboardButtonState() {
+            vm.page.copyPasswordButtonState = "init";
         }
 
         function goToUser(userId) {
@@ -594,7 +614,7 @@
                     var localOffset = new Date().getTimezoneOffset();
                     var serverTimeNeedsOffsetting = (-serverOffset !== localOffset);
 
-                    if(serverTimeNeedsOffsetting) {
+                    if (serverTimeNeedsOffsetting) {
                         dateVal = dateHelper.convertToLocalMomentTime(user.lastLoginDate, serverOffset);
                     } else {
                         dateVal = moment(user.lastLoginDate, "YYYY-MM-DD HH:mm:ss");
diff --git a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
index f82958769a..abf2f80ff2 100644
--- a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
+++ b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
@@ -441,33 +441,30 @@
                 <!-- New password -->
                 <div>
                     <label class="bold"><localize key="user_password">Password</localize></label>
-                    <div class="flex items-center justify-between" style="background-color: #f3f3f5; padding: 10px 20px; border-radius: 3px; margin-bottom: 30px;">
+                    <div class="flex items-center justify-between" style="background-color: #ffffff; padding: 10px 20px; border-radius: 3px; margin-bottom: 30px;">
                         <div ng-show="vm.newUser.showPassword">{{vm.newUser.resetPasswordValue}}</div>
                         <div ng-show="!vm.newUser.showPassword">&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;</div>
                         <div>
-                            <umb-button
-                                ng-if="!vm.newUser.showPassword"
-                                type="button"
-                                action="vm.toggleNewUserPassword()"
-                                label-key="general_show"
-                                size="xs">
+                            <umb-button ng-if="!vm.newUser.showPassword"
+                                        type="button"
+                                        action="vm.toggleNewUserPassword()"
+                                        label-key="general_show"
+                                        size="xs">
                             </umb-button>
-                            <umb-button
-                                ng-if="vm.newUser.showPassword"
-                                type="button"
-                                action="vm.toggleNewUserPassword()"
-                                label-key="general_hide"
-                                size="xs">
+                            <umb-button ng-if="vm.newUser.showPassword"
+                                        type="button"
+                                        action="vm.toggleNewUserPassword()"
+                                        label-key="general_hide"
+                                        size="xs">
                             </umb-button>
-                            <umb-button
-                                ng-if="vm.newUser.resetPasswordValue"
-                                umb-clipboard
-                                umb-clipboard-success="vm.copySuccess()"
-                                umb-clipboard-error="vm.copyError()"
-                                umb-clipboard-text="vm.newUser.resetPasswordValue"
-                                state="vm.page.copyPasswordButtonState"
-                                type="button"
-                                label-key="general_copy" size="xs">
+                            <umb-button ng-if="vm.newUser.resetPasswordValue"
+                                        umb-clipboard
+                                        umb-clipboard-success="vm.copySuccess(e)"
+                                        umb-clipboard-error="vm.copyError(e)"
+                                        umb-clipboard-text="{{vm.newUser.resetPasswordValue}}"
+                                        state="vm.page.copyPasswordButtonState"
+                                        type="button"
+                                        label-key="general_copy" size="xs">
                             </umb-button>
                         </div>
                     </div>