diff --git a/man/waybar.5.scd.in b/man/waybar.5.scd.in
index d7766c90..14a08249 100644
--- a/man/waybar.5.scd.in
+++ b/man/waybar.5.scd.in
@@ -375,6 +375,8 @@ A group may hide all but one element, showing them only on mouse hover. In order
 	Defines the direction of the transition animation. If true, the hidden elements will slide from left to right. If false, they will slide from right to left.
 	When the bar is vertical, it reads as top-to-bottom.
 
+Group drawers are also given the `.expanded` CSS class when they are expanded.
+
 ```
 "group/power": {
     "orientation": "inherit",
diff --git a/src/group.cpp b/src/group.cpp
index 92734fc9..8f7c133c 100644
--- a/src/group.cpp
+++ b/src/group.cpp
@@ -96,11 +96,13 @@ Group::Group(const std::string& name, const std::string& id, const Json::Value&
 void Group::show_group() {
   box.set_state_flags(Gtk::StateFlags::STATE_FLAG_PRELIGHT);
   revealer.set_reveal_child(true);
+  box.get_style_context()->add_class("expanded");
 }
 
 void Group::hide_group() {
   box.unset_state_flags(Gtk::StateFlags::STATE_FLAG_PRELIGHT);
   revealer.set_reveal_child(false);
+  box.get_style_context()->remove_class("expanded");
 }
 
 bool Group::handleMouseEnter(GdkEventCrossing* const& e) {