diff --git a/components/icon/index.en-US.md b/components/icon/index.en-US.md
index c02d24dbc3..86d2d8e663 100644
--- a/components/icon/index.en-US.md
+++ b/components/icon/index.en-US.md
@@ -106,13 +106,14 @@ We added a `createFromIconfontCN` function to help developer use their own icons
```jsx
import React from 'react';
+import ReactDOM from 'react-dom/client';
import { createFromIconfontCN } from '@ant-design/icons';
const MyIcon = createFromIconfontCN({
- scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js', // 在 iconfont.cn 上生成
+ scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js', // generate in iconfont.cn
});
-ReactDOM.render(, mountedNode);
+ReactDOM.createRoot(mountNode).render();
```
It creates a component that uses SVG sprites in essence.
@@ -153,12 +154,14 @@ module.exports = {
```
```jsx
+import React from 'react';
+import ReactDOM from 'react-dom/client';
import Icon from '@ant-design/icons';
import MessageSvg from 'path/to/message.svg'; // path to your '*.svg' file.
// in create-react-app:
// import { ReactComponent as MessageSvg } from 'path/to/message.svg';
-ReactDOM.render(, mountNode);
+ReactDOM.createRoot(mountNode).render();
```
The following properties are available for the component:
diff --git a/components/icon/index.zh-CN.md b/components/icon/index.zh-CN.md
index 88f8a9334d..bc6b7be9be 100644
--- a/components/icon/index.zh-CN.md
+++ b/components/icon/index.zh-CN.md
@@ -101,13 +101,14 @@ getTwoToneColor(); // #eb2f96
```jsx
import React from 'react';
+import ReactDOM from 'react-dom/client';
import { createFromIconfontCN } from '@ant-design/icons';
const MyIcon = createFromIconfontCN({
scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js', // 在 iconfont.cn 上生成
});
-ReactDOM.render(, mountedNode);
+ReactDOM.createRoot(mountNode).render();
```
其本质上是创建了一个使用 `