diff --git a/app/javascript/styles/mastodon/accounts.scss b/app/javascript/styles/mastodon/accounts.scss
index 215774a19..54b65bfc8 100644
--- a/app/javascript/styles/mastodon/accounts.scss
+++ b/app/javascript/styles/mastodon/accounts.scss
@@ -210,9 +210,9 @@
   font-size: 12px;
   line-height: 12px;
   font-weight: 500;
-  color: $ui-secondary-color;
-  background-color: rgba($ui-secondary-color, 0.1);
-  border: 1px solid rgba($ui-secondary-color, 0.5);
+  color: var(--user-role-accent, $ui-secondary-color);
+  background-color: var(--user-role-background, rgba($ui-secondary-color, 0.1));
+  border: 1px solid var(--user-role-border, rgba($ui-secondary-color, 0.5));
 
   &.moderator {
     color: $success-green;
diff --git a/app/views/application/_sidebar.html.haml b/app/views/application/_sidebar.html.haml
index 0a952add0..cc157bf47 100644
--- a/app/views/application/_sidebar.html.haml
+++ b/app/views/application/_sidebar.html.haml
@@ -13,4 +13,4 @@
       %h4.emojify= t('footer.trending_now')
 
       - trends.each do |tag|
-        = react_component :hashtag, hashtag: ActiveModelSerializers::SerializableResource.new(tag, serializer: REST::TagSerializer).as_json
+        = react_component :hashtag, hashtag: ActiveModelSerializers::SerializableResource.new(tag, serializer: REST::TagSerializer, scope: current_user, scope_name: :current_user).as_json
diff --git a/app/views/custom_css/show.css.erb b/app/views/custom_css/show.css.erb
index 521834832..bcbe81962 100644
--- a/app/views/custom_css/show.css.erb
+++ b/app/views/custom_css/show.css.erb
@@ -1,10 +1,12 @@
 <%- if Setting.custom_css.present? %>
-<%= Setting.custom_css %>
+<%= raw Setting.custom_css %>
 
 <%- end %>
 <%- UserRole.where(highlighted: true).select { |role| role.color.present? }.each do |role| %>
 .user-role-<%= role.id %> {
   --user-role-accent: <%= role.color %>;
+  --user-role-background: <%= role.color + '19' %>;
+  --user-role-border: <%= role.color + '80' %>;
 }
 
 <%- end %>