diff --git a/app/assets/javascripts/discourse/views/bookmark-button.js.es6 b/app/assets/javascripts/discourse/views/bookmark-button.js.es6
index 2dfd9bb1265..2a9188d5732 100644
--- a/app/assets/javascripts/discourse/views/bookmark-button.js.es6
+++ b/app/assets/javascripts/discourse/views/bookmark-button.js.es6
@@ -16,7 +16,7 @@ export default ButtonView.extend({
   },
 
   renderIcon: function(buffer) {
-    var className = this.get("controller.bookmarked") ? "fa-bookmark" : "fa-bookmark-o";
-    buffer.push("<i class='fa " + className + "'></i>");
+    var className = this.get("controller.bookmarked") ? "bookmarked" : "";
+    buffer.push("<i class='fa fa-bookmark " + className + "'></i>");
   }
 });
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index c66397066ac..aef34a1431c 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -455,7 +455,7 @@ a.star {
     outline: 0;
     margin-bottom: 5px;
     margin-right: 10px;
-    .fa-star {margin-right: 5px;}
+    .fa-bookmark.bookmarked { color: $tertiary; }
   }
 }
 
diff --git a/app/assets/stylesheets/mobile/topic-post.scss b/app/assets/stylesheets/mobile/topic-post.scss
index 133a0fccefe..0bc7ae48d98 100644
--- a/app/assets/stylesheets/mobile/topic-post.scss
+++ b/app/assets/stylesheets/mobile/topic-post.scss
@@ -292,6 +292,7 @@ a.star {
 #topic-footer-buttons {
   border-top: 1px solid scale-color-diff();
   padding: 20px 10px 0 10px;
+  .fa-bookmark.bookmarked { color: $tertiary; }
 }
 
 /* this is to force the drop-down notification state description para below the button */