diff --git a/src/renderer/less/elements.less b/src/renderer/less/elements.less
index 4c57db78..9341a783 100644
--- a/src/renderer/less/elements.less
+++ b/src/renderer/less/elements.less
@@ -1873,7 +1873,7 @@ input[type=checkbox][switch]:checked:active::before {
     align-items: center;
     color: white;
 
-    > svg {
+    > ._svg-icon {
       height: 16px;
       width: 16px;
       pointer-events: none;
diff --git a/src/renderer/views/app/chrome-top.ejs b/src/renderer/views/app/chrome-top.ejs
index bb7a1f48..ec063027 100644
--- a/src/renderer/views/app/chrome-top.ejs
+++ b/src/renderer/views/app/chrome-top.ejs
@@ -18,13 +18,13 @@
       <div class="app-chrome-item">
         <button class="playback-button navigation" @click="navigateBack()" :title="$root.getLz('term.navigateBack')"
           v-b-tooltip.hover>
-          <%- include('../svg/chevron-left.svg') %>
+          <svg-icon url="./views/svg/chevron-left.svg"></svg-icon>
         </button>
       </div>
       <div class="app-chrome-item">
         <button class="playback-button navigation" @click="navigateForward()"
           :title="$root.getLz('term.navigateForward')" v-b-tooltip.hover>
-          <%- include('../svg/chevron-right.svg') %>
+          <svg-icon url="./views/svg/chevron-right.svg"></svg-icon>
         </button>
       </div>
       <div class="app-chrome-item" v-if="getThemeDirective('windowLayout') == 'twopanel'">