# CSS Classes for Current User's Groups **URL:** https://meta.discourse.org/t/css-classes-for-current-users-groups/226068 **Category:** Theme component **Tags:** official **Created:** [May 4, 2022, 4:06am UTC](https://meta.discourse.org/t/css-classes-for-current-users-groups/226068 "2022-05-04T04:06:25Z") **Posts on this page:** 1 **Page:** 1

### Author: ![Discourse](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/discourse/32/148734_2.png) [@Discourse](https://meta.discourse.org/u/Discourse) #### Post date: [May 4, 2022, 4:06am UTC](https://meta.discourse.org/t/css-classes-for-current-users-groups/226068/1 "2022-05-04T04:06:25Z")

| | | | | --- | --- | --- | | :discourse2: | **Summary** | **CSS Classes for Current User’s Groups** adds the groups that a member is a part of as CSS classes on the `` tag. | | 👓 | **Preview** | [Preview on theme-creator.discourse.org](https://discourse.theme-creator.io/theme/Johani/user-groups-css-classes) | | 🛠 | **Repository Link** | [https://github.com/discourse/discourse-groups-css-classes-in-body](https://github.com/discourse/discourse-groups-css-classes-in-body) | | 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) | Install this theme component Before: ![image](https://global.discourse-cdn.com/meta/original/4X/9/a/4/9a4f2f78bb202cce3a8b042b2f3081818d082c60.png) After: ![image](https://global.discourse-cdn.com/meta/optimized/4X/4/a/0/4a00e001260d4ba7966a30a2b036c1a016dcd986_2_517x27.png) Discourse only adds the current user’s primary group as a CSS class by default. This component changes that so that all of the groups that the current user is a member of are added as classes - including the built-in ones like trust-level. The component takes each group name and adds it as a CSS class like so ```xml group-NAME ``` Once you install and activate this theme component, you can add CSS to your theme that targets specific groups like so ```scss .group-NAME { .some-selector { color: red; } } ``` > Last edited by @JammyDodger 2024-06-03T22:38:48Z > > > **Check document** > > > > Perform check on document: