diff --git a/app/assets/javascripts/discourse-common/lib/icon-library.js.es6 b/app/assets/javascripts/discourse-common/lib/icon-library.js.es6
index fcf3ce404e6..5bf0d55a1b0 100644
--- a/app/assets/javascripts/discourse-common/lib/icon-library.js.es6
+++ b/app/assets/javascripts/discourse-common/lib/icon-library.js.es6
@@ -9,8 +9,28 @@ const REPLACEMENTS = {
   'd-watching-first': 'dot-circle-o',
   'd-drop-expanded': 'caret-down',
   'd-drop-collapsed': 'caret-right',
+  'notification.mentioned': "at",
+  'notification.group_mentioned': "at",
+  'notification.quoted': "quote-right",
+  'notification.replied': "reply",
+  'notification.posted': "reply",
+  'notification.edited': "pencil",
+  'notification.liked': "heart",
+  'notification.liked_2': "heart",
+  'notification.liked_many': "heart",
+  'notification.private_message': "envelope-o",
+  'notification.invited_to_private_message': "envelope-o",
+  'notification.invited_to_topic': "hand-o-right",
+  'notification.invitee_accepted': "user",
+  'notification.moved_post': "sign-out",
+  'notification.linked': "link",
+  'notification.granted_badge': "certificate",
+  'notification.topic_reminder': "hand-o-right",
+  'notification.watching_first_post': "dot-circle-o",
+  'notification.group_message_summary': "group"
 };
 
+
 export function renderIcon(renderType, id, params) {
   for (let i=0; i<_renderers.length; i++) {
     let renderer = _renderers[i];
diff --git a/app/assets/javascripts/discourse/widgets/notification-item.js.es6 b/app/assets/javascripts/discourse/widgets/notification-item.js.es6
index 55ce637d500..08b38446ec9 100644
--- a/app/assets/javascripts/discourse/widgets/notification-item.js.es6
+++ b/app/assets/javascripts/discourse/widgets/notification-item.js.es6
@@ -7,6 +7,7 @@ import { emojiUnescape } from 'discourse/lib/text';
 import { postUrl, escapeExpression } from 'discourse/lib/utilities';
 import { setTransientHeader } from 'discourse/lib/ajax';
 import { userPath } from 'discourse/lib/url';
+import { iconNode } from 'discourse-common/lib/icon-library';
 
 const LIKED_TYPE = 5;
 const INVITED_TYPE = 8;
@@ -98,10 +99,14 @@ createWidget('notification-item', {
     const lookup = this.site.get('notificationLookup');
     const notName = lookup[notificationType];
 
-    const contents = new RawHtml({ html: `<div>${emojiUnescape(this.text(notificationType, notName))}</div>` });
+    let title = I18n.t(`notifications.alt.${notName}`);
+    let icon = iconNode(`notification.${notName}`, { title });
+    let text = emojiUnescape(this.text(notificationType, notName));
+    let html = new RawHtml({ html: `<p>${text}</p>` });
+    let contents = [ icon, html ];
+
     const href = this.url();
-    const alt = I18n.t(`notifications.alt.${notName}`);
-    return href ? h('a', { attributes: { href, alt, 'data-auto-route': true } }, contents) : contents;
+    return href ? h('a', { attributes: { href, title, 'data-auto-route': true } }, contents) : contents;
   },
 
   click(e) {
diff --git a/app/assets/javascripts/discourse/widgets/user-notifications.js.es6 b/app/assets/javascripts/discourse/widgets/user-notifications.js.es6
index 7eaac6f085e..c7570479cc9 100644
--- a/app/assets/javascripts/discourse/widgets/user-notifications.js.es6
+++ b/app/assets/javascripts/discourse/widgets/user-notifications.js.es6
@@ -74,7 +74,8 @@ export default createWidget('user-notifications', {
         const href = `${attrs.path}/notifications`;
 
         items.push(
-          h('li.read.last.heading', h('a', { attributes: { href } }, [I18n.t('notifications.more'), '...'])),
+          h('li.read.last.heading',
+            h('a', { attributes: { href } }, [I18n.t('notifications.more'), '...'])),
           h('hr')
         );
       }
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 7a1a75c10d0..528cfea5f3c 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -1270,31 +1270,30 @@ en:
       empty: "No notifications found."
       more: "view older notifications"
       total_flagged: "total flagged posts"
-      mentioned: "<i title='mentioned' class='fa fa-at'></i><p><span>{{username}}</span> {{description}}</p>"
-      group_mentioned: "<i title='group mentioned' class='fa fa-at'></i><p><span>{{username}}</span> {{description}}</p>"
-      quoted: "<i title='quoted' class='fa fa-quote-right'></i><p><span>{{username}}</span> {{description}}</p>"
-      replied: "<i title='replied' class='fa fa-reply'></i><p><span>{{username}}</span> {{description}}</p>"
-      posted: "<i title='posted' class='fa fa-reply'></i><p><span>{{username}}</span> {{description}}</p>"
-      edited: "<i title='edited' class='fa fa-pencil'></i><p><span>{{username}}</span> {{description}}</p>"
-      liked: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}</span> {{description}}</p>"
-      liked_2: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}}</span> {{description}}</p>"
+      mentioned: "<span>{{username}}</span> {{description}}"
+      group_mentioned: "<span>{{username}}</span> {{description}}"
+      quoted: "<span>{{username}}</span> {{description}}"
+      replied: "<span>{{username}}</span> {{description}}"
+      posted: "<span>{{username}}</span> {{description}}"
+      edited: "<span>{{username}}</span> {{description}}"
+      liked: "<span>{{username}}</span> {{description}}"
+      liked_2: "<span>{{username}}, {{username2}}</span> {{description}}"
       liked_many:
-        one: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}} and 1 other</span> {{description}}</p>"
-        other: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}} and {{count}} others</span> {{description}}</p>"
-      private_message: "<i title='private message' class='fa fa-envelope-o'></i><p><span>{{username}}</span> {{description}}</p>"
-      invited_to_private_message: "<i title='private message' class='fa fa-envelope-o'></i><p><span>{{username}}</span> {{description}}</p>"
-      invited_to_topic: "<i title='invited to topic' class='fa fa-hand-o-right'></i><p><span>{{username}}</span> {{description}}</p>"
-      invitee_accepted: "<i title='accepted your invitation' class='fa fa-user'></i><p><span>{{username}}</span> accepted your invitation</p>"
-      moved_post: "<i title='moved post' class='fa fa-sign-out'></i><p><span>{{username}}</span> moved {{description}}</p>"
-      linked: "<i title='linked post' class='fa fa-link'></i><p><span>{{username}}</span> {{description}}</p>"
-      granted_badge: "<i title='badge granted' class='fa fa-certificate'></i><p>Earned '{{description}}'</p>"
-      topic_reminder: "<i title='topic reminder' class='fa fa-hand-o-right'></i><p><span>{{username}}</span> {{description}}</p>"
-
-      watching_first_post: "<i title='new topic' class='fa fa-dot-circle-o'></i><p><span>New Topic</span> {{description}}</p>"
+        one: "<span>{{username}}, {{username2}} and 1 other</span> {{description}}"
+        other: "<span>{{username}}, {{username2}} and {{count}} others</span> {{description}}"
+      private_message: "<span>{{username}}</span> {{description}}"
+      invited_to_private_message: "<p><span>{{username}}</span> {{description}}"
+      invited_to_topic: "<span>{{username}}</span> {{description}}"
+      invitee_accepted: "<span>{{username}}</span> accepted your invitation"
+      moved_post: "<span>{{username}}</span> moved {{description}}"
+      linked: "<span>{{username}}</span> {{description}}"
+      granted_badge: "Earned '{{description}}'"
+      topic_reminder: "<span>{{username}}</span> {{description}}"
+      watching_first_post: "<span>New Topic</span> {{description}}"
 
       group_message_summary:
-          one: "<i title='messages in group inbox' class='fa fa-group'></i><p> {{count}} message in your {{group_name}} inbox</p>"
-          other: "<i title='messages in group inbox' class='fa fa-group'></i><p> {{count}} messages in your {{group_name}} inbox</p>"
+          one: "{{count}} message in your {{group_name}} inbox"
+          other: "{{count}} messages in your {{group_name}} inbox"
 
       alt:
         mentioned: "Mentioned by"