diff --git a/app/assets/javascripts/discourse/app/components/group-post.js b/app/assets/javascripts/discourse/app/components/group-post.js
index 5222b0858e3..72df8e3c027 100644
--- a/app/assets/javascripts/discourse/app/components/group-post.js
+++ b/app/assets/javascripts/discourse/app/components/group-post.js
@@ -5,7 +5,12 @@ import { prioritizeNameInUx } from "discourse/lib/settings";
 import { propertyEqual } from "discourse/lib/computed";
 
 export default Component.extend({
-  classNameBindings: [":user-stream-item", ":item", "moderatorAction"],
+  classNameBindings: [
+    ":user-stream-item",
+    ":item",
+    "moderatorAction",
+    "primaryGroup",
+  ],
 
   @discourseComputed("post.url")
   postUrl(url) {
@@ -23,4 +28,11 @@ export default Component.extend({
     }
     return this.post.user.username;
   },
+
+  @discourseComputed("post.user")
+  primaryGroup() {
+    if (this.post.user.primary_group_name) {
+      return `group-${this.post.user.primary_group_name}`;
+    }
+  },
 });
diff --git a/app/assets/javascripts/discourse/app/components/user-card-contents.js b/app/assets/javascripts/discourse/app/components/user-card-contents.js
index aec5a99ed45..99811350d01 100644
--- a/app/assets/javascripts/discourse/app/components/user-card-contents.js
+++ b/app/assets/javascripts/discourse/app/components/user-card-contents.js
@@ -23,6 +23,7 @@ export default Component.extend(CardContentsBase, CanCheckEmails, CleansUp, {
     "user.card_background_upload_url::no-bg",
     "isFixed:fixed",
     "usernameClass",
+    "primaryGroup",
   ],
   allowBackgrounds: setting("allow_profile_backgrounds"),
   showBadges: setting("enable_badges"),
@@ -157,6 +158,11 @@ export default Component.extend(CardContentsBase, CanCheckEmails, CleansUp, {
     thisElem.style.backgroundImage = bg;
   },
 
+  @discourseComputed("user.primary_group_name")
+  primaryGroup(primaryGroup) {
+    return `group-${primaryGroup}`;
+  },
+
   _showCallback(username, $target) {
     this._positionCard($target);
     this.setProperties({ visible: true, loading: true });
diff --git a/app/serializers/group_post_user_serializer.rb b/app/serializers/group_post_user_serializer.rb
index 308535bfb6a..9a0337ca51a 100644
--- a/app/serializers/group_post_user_serializer.rb
+++ b/app/serializers/group_post_user_serializer.rb
@@ -1,5 +1,9 @@
 # frozen_string_literal: true
 
 class GroupPostUserSerializer < BasicUserSerializer
-  attributes :title, :name
+  attributes :title, :name, :primary_group_name
+
+  def primary_group_name
+    object.primary_group.name if object.primary_group
+  end
 end