diff --git a/client/scss/components/_icons.scss b/client/scss/components/_icons.scss
index 8ea97b5a4..1026b18e3 100644
--- a/client/scss/components/_icons.scss
+++ b/client/scss/components/_icons.scss
@@ -122,7 +122,6 @@
     $size: 15px;
 
     &:before {
-        content: map-get($icons, 'help');
         display: inline-block;
         width: $size;
         height: $size;
diff --git a/client/scss/settings/_variables.icons.scss b/client/scss/settings/_variables.icons.scss
index a5aaddf9a..8acf36deb 100644
--- a/client/scss/settings/_variables.icons.scss
+++ b/client/scss/settings/_variables.icons.scss
@@ -30,6 +30,8 @@ $icons: (
     'grip': '\e03b',
     'group': '\e031',
     'help': '\e041',
+    // help-inverse directly renders the corresponding character.
+    'help-inverse': '?',
     'home': '\e035',
     // horizontalrule is not rendered as an icon font – it uses a unicode dash character rendered with a fallback font.
     'horizontalrule': '\2014',
diff --git a/wagtail/contrib/styleguide/templates/wagtailstyleguide/base.html b/wagtail/contrib/styleguide/templates/wagtailstyleguide/base.html
index 99b93fb9f..97f0d628c 100644
--- a/wagtail/contrib/styleguide/templates/wagtailstyleguide/base.html
+++ b/wagtail/contrib/styleguide/templates/wagtailstyleguide/base.html
@@ -798,6 +798,7 @@
                 <li class="icon icon-grip">grip</li>
                 <li class="icon icon-group">group</li>
                 <li class="icon icon-help">help</li>
+                <li class="icon icon-help-inverse">help-inverse</li>
                 <li class="icon icon-home">home</li>
                 <li class="icon icon-horizontalrule">horizontalrule</li>
                 <li class="icon icon-image">image</li>