diff --git a/scripts/config/demo-js.json b/scripts/config/demo-js.json
index ad0beac..c5eee77 100644
--- a/scripts/config/demo-js.json
+++ b/scripts/config/demo-js.json
@@ -4,5 +4,8 @@
   "save_dir": "./snapshots/demo-js",
   "trim_icon_prefix": "icon",
   "unit": "px",
-  "default_icon_size": 14
+  "default_icon_size": 14,
+  "default_style": {
+    "display": "inline-block"
+  }
 }
diff --git a/scripts/config/demo-ts.json b/scripts/config/demo-ts.json
index d72d023..16f8b4a 100644
--- a/scripts/config/demo-ts.json
+++ b/scripts/config/demo-ts.json
@@ -4,5 +4,8 @@
   "save_dir": "./snapshots/demo-ts",
   "trim_icon_prefix": "icon",
   "unit": "rem",
-  "default_icon_size": 16
+  "default_icon_size": 16,
+  "default_style": {
+    "display": "block"
+  }
 }
diff --git a/snapshots/demo-js/IconAlipay.js b/snapshots/demo-js/IconAlipay.js
index 170dd0b..9acbf9a 100644
--- a/snapshots/demo-js/IconAlipay.js
+++ b/snapshots/demo-js/IconAlipay.js
@@ -4,8 +4,8 @@ import React from 'react';
 import { getIconColor } from './helper';
 
 const DEFAULT_STYLE = {
-  display: 'block',
-};
+ "display": "inline-block"
+}
 
 const IconAlipay = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/snapshots/demo-js/IconSetup.js b/snapshots/demo-js/IconSetup.js
index efe0e28..6e23dec 100644
--- a/snapshots/demo-js/IconSetup.js
+++ b/snapshots/demo-js/IconSetup.js
@@ -4,8 +4,8 @@ import React from 'react';
 import { getIconColor } from './helper';
 
 const DEFAULT_STYLE = {
-  display: 'block',
-};
+ "display": "inline-block"
+}
 
 const IconSetup = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/snapshots/demo-js/IconUser.js b/snapshots/demo-js/IconUser.js
index b1b497f..77a477c 100644
--- a/snapshots/demo-js/IconUser.js
+++ b/snapshots/demo-js/IconUser.js
@@ -4,8 +4,8 @@ import React from 'react';
 import { getIconColor } from './helper';
 
 const DEFAULT_STYLE = {
-  display: 'block',
-};
+ "display": "inline-block"
+}
 
 const IconUser = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/snapshots/demo-ts/IconAlipay.tsx b/snapshots/demo-ts/IconAlipay.tsx
index 6a9a39e..755cbf5 100644
--- a/snapshots/demo-ts/IconAlipay.tsx
+++ b/snapshots/demo-ts/IconAlipay.tsx
@@ -10,8 +10,8 @@ interface Props extends Omit<SVGAttributes<SVGElement>, 'color'> {
 }
 
 const DEFAULT_STYLE: CSSProperties = {
-  display: 'block',
-};
+ "display": "block"
+}
 
 const IconAlipay: FunctionComponent<Props> = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/snapshots/demo-ts/IconSetup.tsx b/snapshots/demo-ts/IconSetup.tsx
index 86d0f99..65dbe6d 100644
--- a/snapshots/demo-ts/IconSetup.tsx
+++ b/snapshots/demo-ts/IconSetup.tsx
@@ -10,8 +10,8 @@ interface Props extends Omit<SVGAttributes<SVGElement>, 'color'> {
 }
 
 const DEFAULT_STYLE: CSSProperties = {
-  display: 'block',
-};
+ "display": "block"
+}
 
 const IconSetup: FunctionComponent<Props> = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/snapshots/demo-ts/IconUser.tsx b/snapshots/demo-ts/IconUser.tsx
index 2ba6396..a11e152 100644
--- a/snapshots/demo-ts/IconUser.tsx
+++ b/snapshots/demo-ts/IconUser.tsx
@@ -10,8 +10,8 @@ interface Props extends Omit<SVGAttributes<SVGElement>, 'color'> {
 }
 
 const DEFAULT_STYLE: CSSProperties = {
-  display: 'block',
-};
+ "display": "block"
+}
 
 const IconUser: FunctionComponent<Props> = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/src/libs/generateComponent.ts b/src/libs/generateComponent.ts
index 0782fd2..a45b418 100644
--- a/src/libs/generateComponent.ts
+++ b/src/libs/generateComponent.ts
@@ -10,6 +10,7 @@ import { getTemplate } from './getTemplate';
 import {
   replaceCases,
   replaceComponentName,
+  replaceDefaultStyle,
   replaceExports,
   replaceImports,
   replaceNames,
@@ -31,6 +32,7 @@ export const generateComponent = (data: XmlData, config: Config) => {
   const jsExtension = config.use_typescript ? '.ts' : '.js';
   let cases: string = '';
 
+
   mkdirp.sync(saveDir);
   glob.sync(path.join(saveDir, '*')).forEach((file) => fs.unlinkSync(file));
 
@@ -62,6 +64,7 @@ export const generateComponent = (data: XmlData, config: Config) => {
     singleFile = replaceComponentName(singleFile, componentName);
     singleFile = replaceSingleIconContent(singleFile, generateCase(item, 4));
     singleFile = replaceSizeUnit(singleFile, config.unit);
+    singleFile = replaceDefaultStyle(singleFile, config.default_style);
 
     fs.writeFileSync(path.join(saveDir, componentName + jsxExtension), singleFile);
 
diff --git a/src/libs/getConfig.ts b/src/libs/getConfig.ts
index 7fa0eca..03d3b75 100644
--- a/src/libs/getConfig.ts
+++ b/src/libs/getConfig.ts
@@ -10,6 +10,7 @@ export interface Config {
   trim_icon_prefix: string;
   unit: string;
   default_icon_size: number;
+  default_style: Record<string, string>;
 }
 
 let cacheConfig: Config;
diff --git a/src/libs/iconfont.json b/src/libs/iconfont.json
index 67c3a49..4700cf7 100644
--- a/src/libs/iconfont.json
+++ b/src/libs/iconfont.json
@@ -4,5 +4,8 @@
   "save_dir": "./src/components/iconfont",
   "trim_icon_prefix": "icon",
   "unit": "px",
-  "default_icon_size": 18
+  "default_icon_size": 18,
+  "default_style": {
+    "display": "block"
+  }
 }
diff --git a/src/libs/replace.ts b/src/libs/replace.ts
index 95b5009..cabd379 100644
--- a/src/libs/replace.ts
+++ b/src/libs/replace.ts
@@ -39,4 +39,10 @@ export const replaceExports = (content: string, exports: string[]) => {
   return content.replace(/#exports#/g, exports.map(
     (item) => `export { default as ${item} } from './${item}';`).join('\n')
   );
-}
\ No newline at end of file
+}
+
+export const replaceDefaultStyle = (content: string, defaultStyle: Record<string, string>) => {
+  return content.replace(/#defaultStyle#/g, JSON.stringify(defaultStyle, null, " ") || `{
+    "display": "block",
+  }`)
+};
diff --git a/src/templates/SingleIcon.js.template b/src/templates/SingleIcon.js.template
index 559fd21..4bf4a25 100644
--- a/src/templates/SingleIcon.js.template
+++ b/src/templates/SingleIcon.js.template
@@ -3,9 +3,7 @@
 import React from 'react';
 import { getIconColor } from './helper';
 
-const DEFAULT_STYLE = {
-  display: 'block',
-};
+const DEFAULT_STYLE = #defaultStyle#
 
 const #componentName# = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
diff --git a/src/templates/SingleIcon.tsx.template b/src/templates/SingleIcon.tsx.template
index e86fd17..e887576 100644
--- a/src/templates/SingleIcon.tsx.template
+++ b/src/templates/SingleIcon.tsx.template
@@ -9,9 +9,7 @@ interface Props extends Omit<SVGAttributes<SVGElement>, 'color'> {
   color?: string | string[];
 }
 
-const DEFAULT_STYLE: CSSProperties = {
-  display: 'block',
-};
+const DEFAULT_STYLE: CSSProperties = #defaultStyle#
 
 const #componentName#: FunctionComponent<Props> = ({ size, color, style: _style, ...rest }) => {
   const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;