diff --git a/frontend/src/icons/svg/icon_info_filled.svg b/frontend/src/icons/svg/icon_info_filled.svg
new file mode 100644
index 0000000000..34439a4850
--- /dev/null
+++ b/frontend/src/icons/svg/icon_info_filled.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23Z"/>
+<path d="M12 5.5C12.6903 5.5 13.25 6.05965 13.25 6.75C13.25 7.44035 12.6903 8 12 8C11.3097 8 10.75 7.44035 10.75 6.75C10.75 6.05965 11.3097 5.5 12 5.5Z" fill="white"/>
+<path d="M12.25 9H10.75C10.4739 9 10.25 9.22386 10.25 9.5V10.5C10.25 10.7761 10.4739 11 10.75 11H11.25V16H10C9.72386 16 9.5 16.2239 9.5 16.5V17.5C9.5 17.7761 9.72386 18 10 18H14.5C14.7761 18 15 17.7761 15 17.5V16.5C15 16.2239 14.7761 16 14.5 16H13.25V10C13.25 9.44772 12.8023 9 12.25 9Z" fill="white"/>
+</svg>
diff --git a/frontend/src/icons/svg/icon_info_outlined.svg b/frontend/src/icons/svg/icon_info_outlined.svg
new file mode 100644
index 0000000000..eebdd2f505
--- /dev/null
+++ b/frontend/src/icons/svg/icon_info_outlined.svg
@@ -0,0 +1,12 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_3234_102287)">
+<path d="M12 5.5C12.6903 5.5 13.25 6.05965 13.25 6.75C13.25 7.44035 12.6903 8 12 8C11.3097 8 10.75 7.44035 10.75 6.75C10.75 6.05965 11.3097 5.5 12 5.5Z"/>
+<path d="M12.25 9H10.75C10.4739 9 10.25 9.22386 10.25 9.5V10.5C10.25 10.7761 10.4739 11 10.75 11H11.25V16H10C9.72386 16 9.5 16.2239 9.5 16.5V17.5C9.5 17.7761 9.72386 18 10 18H14.5C14.7761 18 15 17.7761 15 17.5V16.5C15 16.2239 14.7761 16 14.5 16H13.25V10C13.25 9.44772 12.8023 9 12.25 9Z" />
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 22.9998C5.925 22.9998 1 18.0748 1 11.9998C1 5.92476 5.925 0.999756 12 0.999756C18.075 0.999756 23 5.92476 23 11.9998C23 18.0748 18.075 22.9998 12 22.9998ZM12 20.9998C16.9705 20.9998 21 16.9703 21 11.9998C21 7.02926 16.9705 2.99976 12 2.99976C7.0295 2.99976 3 7.02926 3 11.9998C3 16.9703 7.0295 20.9998 12 20.9998Z"/>
+</g>
+<defs>
+<clipPath id="clip0_3234_102287">
+<rect width="24" height="24" rx="4"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/frontend/src/views/chart/components/dragItem/components/FieldErrorTips.vue b/frontend/src/views/chart/components/dragItem/components/FieldErrorTips.vue
index 8f184ef6bc..30e56d3d1c 100644
--- a/frontend/src/views/chart/components/dragItem/components/FieldErrorTips.vue
+++ b/frontend/src/views/chart/components/dragItem/components/FieldErrorTips.vue
@@ -6,7 +6,7 @@
       :content="$t('chart.field_error_tips')"
       placement="bottom"
     >
-      <span><i class="el-icon-warning" /></span>
+      <span><svg-icon icon-class="icon_info_filled" /></span>
     </el-tooltip>
   </div>
 </template>
diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue
index 48c63a2925..82756d5a20 100644
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@@ -28,11 +28,7 @@
           :data="view"
           :tab-status="tabStatus"
         />
-        <i
-          slot="reference"
-          class="el-icon-warning icon-class"
-          style="position:absolute; margin-left: 30px; top:14px;cursor: pointer;"
-        />
+        <svg-icon slot="reference" class="icon-class" style="position:absolute; margin-left: 30px; top:14px;cursor: pointer;" icon-class="icon_info_filled" />
       </el-popover>
       <span
         class="title-text view-title-name"
diff --git a/frontend/src/views/dataset/add/AddExcel.vue b/frontend/src/views/dataset/add/AddExcel.vue
index 83c3f58d83..1a2a50abbe 100644
--- a/frontend/src/views/dataset/add/AddExcel.vue
+++ b/frontend/src/views/dataset/add/AddExcel.vue
@@ -26,7 +26,7 @@
         {{ $t('dataset.excel_info_2') }}<br>
         {{ $t('dataset.excel_info_3') }}
       </div>
-      <i class="el-icon-warning-outline"/> </el-tooltip></span>
+      <svg-icon icon-class="icon_info_outlined" /></el-tooltip></span>
       <i
         class="el-icon-d-arrow-left"
         @click="showLeft = false"
diff --git a/frontend/src/views/dataset/add/AddSQL.vue b/frontend/src/views/dataset/add/AddSQL.vue
index fb193a2f0e..76ae340e49 100644
--- a/frontend/src/views/dataset/add/AddSQL.vue
+++ b/frontend/src/views/dataset/add/AddSQL.vue
@@ -454,7 +454,7 @@
                     :content="$t('commons.parameter_effect')"
                     placement="top"
                   >
-                    <i class="el-icon-warning"/>
+                    <svg-icon icon-class="icon_info_filled" />
                   </el-tooltip>
                 </template>
                 <template slot-scope="scope">
diff --git a/frontend/src/views/dataset/data/ViewTable.vue b/frontend/src/views/dataset/data/ViewTable.vue
index feaf71e105..6d75c04484 100644
--- a/frontend/src/views/dataset/data/ViewTable.vue
+++ b/frontend/src/views/dataset/data/ViewTable.vue
@@ -48,10 +48,7 @@
             :data="table"
             :tab-status="tabStatus"
           />
-          <i
-            slot="reference"
-            class="el-icon-warning-outline detail"
-          />
+          <svg-icon slot="reference" class="detail" icon-class="icon_info_outlined" />
         </el-popover>
       </el-col>
       <el-col
diff --git a/frontend/src/views/panel/list/PanelViewShow.vue b/frontend/src/views/panel/list/PanelViewShow.vue
index ce238dea27..85eee9d883 100644
--- a/frontend/src/views/panel/list/PanelViewShow.vue
+++ b/frontend/src/views/panel/list/PanelViewShow.vue
@@ -77,11 +77,7 @@
               trigger="click"
             >
               <panel-detail-info />
-              <i
-                slot="reference"
-                class="el-icon-warning-outline icon-class"
-                style="margin-left: 4px;cursor: pointer;font-size: 14px;"
-              />
+              <svg-icon slot="reference" style="margin-left: 4px;cursor: pointer;font-size: 14px;" class="icon-class" icon-class="icon_info_outlined" />
             </el-popover>
           </el-col>
           <el-col :span="12">
diff --git a/frontend/src/views/system/datasource/DsConfiguration.vue b/frontend/src/views/system/datasource/DsConfiguration.vue
index 32cefd2a3b..b76c5fbec4 100644
--- a/frontend/src/views/system/datasource/DsConfiguration.vue
+++ b/frontend/src/views/system/datasource/DsConfiguration.vue
@@ -71,7 +71,7 @@
                     popper-class="api-table-delete"
                     trigger="click"
                   >
-                    <i :disabled="disabled" class="el-icon-warning" />
+                    <svg-icon :disabled="disabled" icon-class="icon_info_filled" />
                     <div class="tips">
                       {{ $t('datasource.delete_this_item') }}
                     </div>
diff --git a/frontend/src/views/system/sysParam/BasicSetting.vue b/frontend/src/views/system/sysParam/BasicSetting.vue
index 8f1cfa19e5..e544bf03e2 100644
--- a/frontend/src/views/system/sysParam/BasicSetting.vue
+++ b/frontend/src/views/system/sysParam/BasicSetting.vue
@@ -47,7 +47,7 @@
             :content="$t('system_parameter_setting.front_time_out')"
             placement="top"
           >
-            <i class="el-icon-warning-outline tips" />
+            <svg-icon class="tips" icon-class="icon_info_outlined" />
           </el-tooltip>
         </template>
         <el-input
diff --git a/frontend/src/views/system/sysParam/EmailSetting.vue b/frontend/src/views/system/sysParam/EmailSetting.vue
index 4ff1473d75..698c4e15d0 100644
--- a/frontend/src/views/system/sysParam/EmailSetting.vue
+++ b/frontend/src/views/system/sysParam/EmailSetting.vue
@@ -90,7 +90,7 @@
             :content="$t('system_parameter_setting.test_mail_recipient')"
             placement="top"
           >
-            <i class="el-icon-warning-outline tips-not-absolute" />
+            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
           </el-tooltip>
         </template>
         <dePwd
@@ -106,7 +106,7 @@
             :content="$t('system_parameter_setting.to_enable_ssl')"
             placement="top"
           >
-            <i class="el-icon-warning-outline tips-not-absolute" />
+            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
           </el-tooltip>
         </el-checkbox>
 
@@ -118,7 +118,7 @@
             :content="$t('system_parameter_setting.to_enable_tsl')"
             placement="top"
           >
-            <i class="el-icon-warning-outline tips-not-absolute" />
+            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
           </el-tooltip>
         </el-checkbox>
       </el-form-item>
diff --git a/frontend/src/views/system/user/index.vue b/frontend/src/views/system/user/index.vue
index a45d78fb37..c1f4fc52f2 100644
--- a/frontend/src/views/system/user/index.vue
+++ b/frontend/src/views/system/user/index.vue
@@ -261,7 +261,7 @@
               popper-class="reset-pwd"
               trigger="click"
             >
-              <i class="el-icon-warning" />
+              <svg-icon icon-class="icon_info_filled" />
               <div class="tips">{{ $t('user.recover_pwd') }}</div>
               <div class="editer-form-title">
                 <span