diff --git a/common/loginpage/src/css/styles.less b/common/loginpage/src/css/styles.less
index e2570c875..19d6100af 100644
--- a/common/loginpage/src/css/styles.less
+++ b/common/loginpage/src/css/styles.less
@@ -2665,12 +2665,11 @@ li.menu-item {
       margin-left: 16px;
     } 
     
-    .icon--default {
-      border: initial;
-    }
-    
     .icon {
       display:none;
+    }
+    
+    .icon, .icon--default {
       border: @scaled-one-px solid @border-divider;
       border-radius: 4px;
       width: 475px;
diff --git a/common/loginpage/src/dialogpreview.js b/common/loginpage/src/dialogpreview.js
index a1af52a91..e7b2736c9 100644
--- a/common/loginpage/src/dialogpreview.js
+++ b/common/loginpage/src/dialogpreview.js
@@ -5,7 +5,7 @@ function PreviewTemplateDialog(model, params = {}) {
     const bodyTemplate = `
         <div class="template-preview-body">
             <div class="img-container">
-                <svg class='icon--default'><use xlink:href='#template-item'></use></svg>
+                <img class='icon--default' src="${model.icon}">
                 <img class="icon" src="${model.preview}" style="display:none;">
             </div>
             <div class="description">
@@ -55,7 +55,7 @@ PreviewTemplateDialog.prototype.show = function(width) {
 
     const {$el} = this.getElements();
     const $img = $el.find('img.icon');
-    const $icon = $el.find('svg.icon--default');
+    const $icon = $el.find('img.icon--default');
 
     $img.on('load', () => {
         $icon.hide();