diff --git a/packages/amis-ui/scss/components/form/_icon-select.scss b/packages/amis-ui/scss/components/form/_icon-select.scss
index 94b792846..84b119e22 100644
--- a/packages/amis-ui/scss/components/form/_icon-select.scss
+++ b/packages/amis-ui/scss/components/form/_icon-select.scss
@@ -53,6 +53,19 @@
       align-items: center;
       justify-content: flex-start;
       overflow: hidden;
+
+      img.icon {
+        height: var(--sizes-size-7);
+        margin-right: var(--sizes-size-4);
+      }
+
+      &-str-svg {
+        height: var(--fontSizeBase);
+        svg {
+          width: 100%;
+          height: 100%;
+        }
+      }
     }
 
     &-wrapper {
diff --git a/packages/amis/src/renderers/Form/IconSelect.tsx b/packages/amis/src/renderers/Form/IconSelect.tsx
index 834444b17..1a86cc7d9 100644
--- a/packages/amis/src/renderers/Form/IconSelect.tsx
+++ b/packages/amis/src/renderers/Form/IconSelect.tsx
@@ -121,10 +121,12 @@ export default class IconSelectControl extends React.PureComponent<
       disabled,
       value: valueTemp,
       placeholder,
-      clearable,
+      clearable
     } = this.props;
     const value =
       typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
+    const SvgStr =
+      typeof valueTemp === 'string' && valueTemp.match(/(<svg.{1,}\/svg>)/);
 
     const pureValue =
       (value?.id && String(value.id).replace(/^svg-/, '')) || '';
@@ -138,14 +140,21 @@ export default class IconSelectControl extends React.PureComponent<
               <use xlinkHref={`#${pureValue}`}></use>
             </svg>
           </div>
-        ) : (
-          <Icon icon={valueTemp} className="icon" />
-        )}
+        ) : valueTemp ? (
+          SvgStr ? (
+            <div
+              className={cx(`${ns}IconSelectControl-input-area-str-svg`)}
+              dangerouslySetInnerHTML={{__html: SvgStr[0].replace(/\\"/g, '"')}}
+            ></div>
+          ) : (
+            <Icon icon={valueTemp} className="icon" />
+          )
+        ) : null}
         <span className={cx(`${ns}IconSelectControl-input-icon-id`)}>
           {iconName}
         </span>
 
-        {clearable && !disabled && pureValue ? (
+        {clearable && !disabled && (pureValue || valueTemp) ? (
           <a
             onClick={this.handleClear}
             className={cx(`${ns}IconSelectControl-clear`)}