diff --git a/app/views/workloads/_trigger.erb b/app/views/workloads/_trigger.erb
index 8916689..4ab231c 100644
--- a/app/views/workloads/_trigger.erb
+++ b/app/views/workloads/_trigger.erb
@@ -3,7 +3,9 @@
 # Parameters:
 # trigger_for: set as "data-for"-attribute
 #
-# ▶ is a right-pointing filled triangle.
+# The icon is rendered once as 'angle-right'. The opened state is expressed by
+# the 'opened' css class, which rotates it by 90 degrees. Do not swap the icon
+# in JavaScript; the class is the single source of truth for the state.
 %>
 
-<span class="trigger closed" data-for="<%= trigger_for %>">&#x25b6;</span>
+<span class="trigger closed" data-for="<%= trigger_for %>"><%= sprite_icon('angle-right') %></span>
diff --git a/assets/javascripts/slides.js b/assets/javascripts/slides.js
index 9fbe50e..c922ed9 100644
--- a/assets/javascripts/slides.js
+++ b/assets/javascripts/slides.js
@@ -6,8 +6,6 @@
 
 $(document).ready(function() {
 	$('.trigger').click(function() {
-		var OPENED = '&#x25bc;'
-		var CLOSED = '&#x25b6;'
 		$(this).toggleClass('closed opened');
 
 		identifier = $(this).attr('data-for');
@@ -44,7 +42,6 @@ $(document).ready(function() {
 				$(this).show(); // but keep its 'children' closed if any
 				$(this).siblings('.invisible-issues-summary.' + identifierClasses).show();
 			});
-			$(this).html(OPENED);
 		}
 		else {
 			lowerHierarchieLevelClasses = bottomUpHierarchieChain.get(currentHierarchieLevel);
@@ -54,11 +51,10 @@ $(document).ready(function() {
 				$(css).hide();
 				$(css).siblings('.invisible-issues-summary.' + identifierClasses).hide();
 				currentHierarchieLevel = $(css).find('span.trigger.opened');
-				currentHierarchieLevel.html(CLOSED);
+				currentHierarchieLevel.removeClass('opened').addClass('closed');
 				currentHierarchieLevel.siblings('dl').hide();
 			})
 			$(this).siblings().hide();
-			$(this).html(CLOSED);
 		}
 	});
 });
diff --git a/assets/stylesheets/style.css b/assets/stylesheets/style.css
index 61504d8..4b7231e 100644
--- a/assets/stylesheets/style.css
+++ b/assets/stylesheets/style.css
@@ -146,6 +146,15 @@
     margin-right: 4px;
 }
 
+.controller-workloads .data .trigger svg {
+    vertical-align: middle;
+    transition: transform 0.15s ease-in-out;
+}
+
+.controller-workloads .data .trigger.opened svg {
+    transform: rotate(90deg);
+}
+
 .controller-workloads table dt.mt-5,
 .controller-workloads table dd.mt-5 {
     margin-top: 5px;