diff --git a/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx b/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx
index ed97f30c8df..db45714136e 100644
--- a/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx
+++ b/public/app/core/components/Permissions/DisabledPermissionsListItem.tsx
@@ -13,7 +13,7 @@ export default class DisabledPermissionListItem extends Component<IProps, any> {
     return (
       <tr className="gf-form-disabled">
         <td style={{ width: '100%' }}>
-          <i className={item.icon} />
+          <i className={`fa--permissions-list ${item.icon}`} />
           <span dangerouslySetInnerHTML={{ __html: item.nameHtml }} />
         </td>
         <td />
diff --git a/public/app/core/components/Permissions/PermissionsListItem.tsx b/public/app/core/components/Permissions/PermissionsListItem.tsx
index 3c9af2fbfc7..8f9de42343a 100644
--- a/public/app/core/components/Permissions/PermissionsListItem.tsx
+++ b/public/app/core/components/Permissions/PermissionsListItem.tsx
@@ -20,7 +20,7 @@ export default observer(({ item, removeItem, permissionChanged, itemIndex, folde
   return (
     <tr className={setClassNameHelper(item.inherited)}>
       <td style={{ width: '100%' }}>
-        <i className={item.icon} />
+        <i className={`fa--permissions-list ${item.icon}`} />
         <span dangerouslySetInnerHTML={{ __html: item.nameHtml }} />
       </td>
       <td>
diff --git a/public/sass/base/_icons.scss b/public/sass/base/_icons.scss
index b1c787cdd4b..c701cc1249e 100644
--- a/public/sass/base/_icons.scss
+++ b/public/sass/base/_icons.scss
@@ -198,3 +198,8 @@
     background-image: url('../img/icons_dark_theme/icon_question.svg');
   }
 }
+
+.fa--permissions-list {
+  min-width: 20px;
+  padding-right: 5px;
+}