diff --git a/awx/ui/client/src/templates/workflows/workflow-maker/workflow-maker.partial.html b/awx/ui/client/src/templates/workflows/workflow-maker/workflow-maker.partial.html
index 7b6f9975d6..2f83bbd08b 100644
--- a/awx/ui/client/src/templates/workflows/workflow-maker/workflow-maker.partial.html
+++ b/awx/ui/client/src/templates/workflows/workflow-maker/workflow-maker.partial.html
@@ -37,7 +37,7 @@
         <div class="WorkflowMaker-contentLeft">
             <div class="WorkflowLegend-maker">
                 <div class="WorkflowLegend-maker--left">
-                    <i ng-class="{{ keyClassList }}" class="fa fa-key Key-menuIcon" ng-click="toggleKey()"></i>
+                    <i ng-class="{{ keyClassList }}" class="fa fa-compass Key-menuIcon" ng-click="toggleKey()"></i>
                     <ul ng-show="showKey" class="Key-list noselect">
                         <li class="Key-listItem">
                             <p class="Key-heading">{{strings.get('workflow_maker.KEY')}}</p>
diff --git a/awx/ui/client/src/workflow-results/workflow-results.partial.html b/awx/ui/client/src/workflow-results/workflow-results.partial.html
index 34f85c9926..4504075b46 100644
--- a/awx/ui/client/src/workflow-results/workflow-results.partial.html
+++ b/awx/ui/client/src/workflow-results/workflow-results.partial.html
@@ -325,7 +325,7 @@
                 <workflow-status-bar></workflow-status-bar>
                 <div class="WorkflowLegend-details">
                     <div class="WorkflowLegend-details--left">
-                        <i ng-class="{{ keyClassList }}" class="fa fa-key Key-menuIcon" ng-click="toggleKey()"></i>
+                        <i ng-class="{{ keyClassList }}" class="fa fa-compass Key-menuIcon" ng-click="toggleKey()"></i>
                         <ul ng-show="showKey" class="Key-list noselect">
                             <li class="Key-listItem">
                                 <p class="Key-heading">{{strings.legend.KEY}}</p>