diff --git a/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm.vue b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm.vue
index ff59d9812..4f05abc09 100644
--- a/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm.vue
+++ b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm.vue
@@ -59,6 +59,9 @@ import localizeEn from 'ajv-i18n/localize/en';
 import IVSHMEM_REGION from "./ConfigForm/CustomWidget/IVSHMEM_REGION.vue";
 import cpu_affinity from "./ConfigForm/CustomWidget/cpu_affinity.vue";
 import VUART from "./ConfigForm/CustomWidget/VUART.vue";
+import Network from "./ConfigForm/CustomWidget/Virtio/Network.vue";
+import Console from "./ConfigForm/CustomWidget/Virtio/Console.vue";
+import Input from "./ConfigForm/CustomWidget/Virtio/Input.vue";
 
 i18n.useLocal(localizeEn);
 export default {
@@ -80,6 +83,20 @@ export default {
         "labelSuffix": "："
       },
       uiSchema: {
+        "virtio_devices": {
+          "network": {
+            "ui:title": "",
+            'ui:field': Network,
+          },
+          "console": {
+            "ui:title": "",
+            'ui:field': Console,
+          },
+          "input": {
+            "ui:title": "",
+            'ui:field': Input,
+          },
+        },
         "cpu_affinity": {
           'ui:field': cpu_affinity
         },
diff --git a/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Console.vue b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Console.vue
new file mode 100644
index 000000000..bf4943cdd
--- /dev/null
+++ b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Console.vue
@@ -0,0 +1,168 @@
+<template>
+  <div class="virtio_consoles" v-if="defaultVal && defaultVal.length>0">
+    <div class="virtio_console" v-for="(console, index) in defaultVal">
+      <div class="virtio_console_demo">
+        <b style="margin-bottom: 2rem">Virtio console device</b>
+        <b-row class="align-items-center my-2 mt-4">
+          <b-col md="2">
+            <label>Use type: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-select v-model="console.use_type" :options="ConsoleUseType"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center">
+          <b-col md="2">
+            <label>Backend type: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-select v-model="console.backend_type" :options="ConsoleBackendType"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center my-2" v-if="console.backend_type === 'file'">
+          <b-col md="2">
+            <label>Output file path: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-input v-model="console.output_file_path"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center my-2" v-else-if="console.backend_type === 'tty'">
+          <b-col md="2">
+            <label>TTY device path: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-input v-model="console.tty_device_path"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center my-2" v-else-if="console.backend_type === 'sock client' || console.backend_type === 'sock server'">
+          <b-col md="2">
+            <label>Sock file path: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-input v-model="console.sock_file_path"/>
+          </b-col>
+        </b-row>
+
+      </div>
+      <div class="ToolSet">
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="removeVirtioConsole(index)">
+            <Minus/>
+          </Icon>
+        </div>
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="addVirtioConsole">
+            <Plus/>
+          </Icon>
+        </div>
+      </div>
+
+    </div>
+
+  </div>
+  <div v-else>
+    <b style="margin-bottom: 2rem">Virtio console device</b>
+    <div class="ToolSet">
+      <div @click="addVirtioConsole">
+        <Icon size="18px">
+          <Plus/>
+        </Icon>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import _ from "lodash";
+import {Icon} from "@vicons/utils";
+import {Plus, Minus} from '@vicons/fa'
+import {fieldProps, vueUtils} from '@lljj/vue3-form-naive';
+
+export default {
+  name: "Console",
+  components: {Icon, Plus, Minus},
+  props: {
+    ...fieldProps,
+    fieldProps: {
+      type: null,
+      default: null
+    }
+  },
+  data() {
+    return {
+      ConsoleUseType: this.rootSchema.definitions['VirtioConsoleUseType']['enum'],
+      ConsoleBackendType: this.rootSchema.definitions['VirtioConsoleBackendType']['enum'],
+      defaultVal: vueUtils.getPathVal(this.rootFormData, this.curNodePath)
+    };
+  },
+  watch: {
+    rootFormData: {
+      handler(newValue, oldValue) {
+        this.defaultVal = vueUtils.getPathVal(newValue, this.curNodePath)
+      },
+      deep: true
+    },
+    defaultVal: {
+      handler(newValue, oldValue) {
+        // Note: `newValue` will be equal to `oldValue` here
+        // on nested mutations as long as the object itself
+        // hasn't been replaced.
+        vueUtils.setPathVal(this.rootFormData, this.curNodePath, newValue);
+      },
+      deep: true
+    }
+  },
+  methods: {
+    removeVirtioConsole(index) {
+      this.defaultVal.splice(index, 1);
+    },
+    addVirtioConsole() {
+      if (!_.isArray(this.defaultVal)) {
+        this.defaultVal = []
+      }
+      this.defaultVal.push({
+        "use_type": this.ConsoleUseType,
+        "backend_type": this.ConsoleBackendType,
+        "output_file_path": "",
+        "sock_file_path": "",
+        "tty_device_path": "",
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.ToolSet {
+  display: flex;
+  flex-direction: row-reverse;
+  gap: 8px;
+}
+.ToolSet div{
+  padding: 8px;
+  border: 1px solid rgb(193,193,193);
+  border-radius: 5px;
+}
+.virtio_consoles{
+  width: 100%;
+}
+.virtio_console {
+  width: 100%;
+  display: flex;
+  gap: 2rem;
+  align-items: end;
+}
+
+.virtio_console_demo {
+  width: 100%;
+  border: 2px solid #cccccc;
+  padding: 8px 2px 12px 6px;
+  border-radius: 5px;
+  margin-bottom: 1rem;
+}
+</style>
\ No newline at end of file
diff --git a/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Input.vue b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Input.vue
new file mode 100644
index 000000000..ec7ac3f4c
--- /dev/null
+++ b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Input.vue
@@ -0,0 +1,140 @@
+<template>
+  <div class="virtio_inputs" v-if="defaultVal && defaultVal.length>0">
+    <div class="virtio_input" v-for="(input, index) in defaultVal">
+      <div class="virtio_input_demo">
+        <b style="margin-bottom: 2rem">Virtio input device</b>
+        <b-row class="align-items-center my-2 mt-4">
+          <b-col md="2">
+            <label>Backend device file: </label>
+          </b-col>
+          <b-col md="8">
+            <b-form-select v-model="input.backend_device_file" :options="BackendDeviceFileType"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center my-2">
+          <b-col md="2">
+            Guest virtio input device unique identifier:
+          </b-col>
+          <b-col md="4">
+            <b-form-input v-model="input.id"/>
+          </b-col>
+        </b-row>
+      </div>
+      <div class="ToolSet">
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="removeVirtioInput(index)">
+            <Minus/>
+          </Icon>
+        </div>
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="addVirtioInput">
+            <Plus/>
+          </Icon>
+        </div>
+      </div>
+
+    </div>
+
+  </div>
+  <div v-else>
+    <b style="margin-bottom: 2rem">Virtio input device</b>
+    <div class="ToolSet">
+      <div @click="addVirtioInput">
+        <Icon size="18px">
+          <Plus/>
+        </Icon>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import _ from "lodash";
+import {Icon} from "@vicons/utils";
+import {Plus, Minus} from '@vicons/fa'
+import {fieldProps, vueUtils} from '@lljj/vue3-form-naive';
+
+export default {
+  name: "Input",
+  components: {Icon, Plus, Minus},
+  props: {
+    ...fieldProps,
+    fieldProps: {
+      type: null,
+      default: null
+    }
+  },
+  data() {
+    return {
+      BackendDeviceFileType: this.rootSchema.definitions['VirtioInputConfiguration']['properties']['backend_device_file']['enum'],
+      defaultVal: vueUtils.getPathVal(this.rootFormData, this.curNodePath)
+    };
+  },
+  watch: {
+    rootFormData: {
+      handler(newValue, oldValue) {
+        this.defaultVal = vueUtils.getPathVal(newValue, this.curNodePath)
+      },
+      deep: true
+    },
+    defaultVal: {
+      handler(newValue, oldValue) {
+        // Note: `newValue` will be equal to `oldValue` here
+        // on nested mutations as long as the object itself
+        // hasn't been replaced.
+        vueUtils.setPathVal(this.rootFormData, this.curNodePath, newValue);
+      },
+      deep: true
+    }
+  },
+  methods: {
+    removeVirtioInput(index) {
+      this.defaultVal.splice(index, 1);
+    },
+    addVirtioInput() {
+      if (!_.isArray(this.defaultVal)) {
+        this.defaultVal = []
+      }
+      this.defaultVal.push({
+        "backend_device_file": "",
+        "id": "",
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+label:after{
+  content: '*';
+  color: red;
+}
+.ToolSet {
+  display: flex;
+  flex-direction: row-reverse;
+  gap: 8px;
+}
+.ToolSet div{
+  padding: 8px;
+  border: 1px solid rgb(193,193,193);
+  border-radius: 5px;
+}
+.virtio_inputs{
+  width: 100%;
+}
+.virtio_input {
+  width: 100%;
+  display: flex;
+  gap: 2rem;
+  align-items: end;
+}
+
+.virtio_input_demo {
+  width: 100%;
+  border: 2px solid #cccccc;
+  padding: 8px 0 12px 6px;
+  border-radius: 5px;
+  margin-bottom: 1rem;
+}
+</style>
\ No newline at end of file
diff --git a/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Network.vue b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Network.vue
new file mode 100644
index 000000000..c29145d15
--- /dev/null
+++ b/misc/config_tools/configurator/packages/configurator/src/pages/Config/ConfigForm/CustomWidget/Virtio/Network.vue
@@ -0,0 +1,141 @@
+<template>
+  <div class="virtio_networks" v-if="defaultVal && defaultVal.length>0">
+    <div class="virtio_network" v-for="(network, index) in defaultVal">
+      <div class="virtio_network_demo">
+        <b style="margin-bottom: 2rem">Virtio network device</b>
+        <b-row class="align-items-center my-2 mt-4">
+          <b-col md="2">
+            <label>Virtio framework: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-select v-model="network.virtio_framework" :options="NetworkFrameworkType"/>
+          </b-col>
+        </b-row>
+
+        <b-row class="align-items-center my-2">
+          <b-col md="2">
+            <label>Network interface name: </label>
+          </b-col>
+          <b-col md="4">
+            <b-form-input v-model="network.interface_name"/>
+          </b-col>
+        </b-row>
+      </div>
+      <div class="ToolSet">
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="removeVirtioNetwork(index)">
+            <Minus/>
+          </Icon>
+        </div>
+        <div>
+          <Icon size="18px" color="rgb(60,60,60)" @click="addVirtioNetwork">
+            <Plus/>
+          </Icon>
+        </div>
+      </div>
+
+    </div>
+
+  </div>
+  <div v-else>
+    <b style="margin-bottom: 2rem">Virtio network device</b>
+    <div class="ToolSet">
+      <div @click="addVirtioNetwork">
+        <Icon size="18px">
+          <Plus/>
+        </Icon>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import _ from "lodash";
+import {Icon} from "@vicons/utils";
+import {Plus, Minus} from '@vicons/fa'
+import {fieldProps, vueUtils} from '@lljj/vue3-form-naive';
+
+export default {
+  name: "Network",
+  components: {Icon, Plus, Minus},
+  props: {
+    ...fieldProps,
+    fieldProps: {
+      type: null,
+      default: null
+    }
+  },
+  data() {
+    return {
+      NetworkFrameworkType: this.rootSchema.definitions['VirtioNetworkFrameworkType']['enum'],
+      NetworkFrameworkDefault: this.rootSchema.definitions['VirtioNetworkConfiguration']['properties']['virtio_framework']['default'],
+      defaultVal: vueUtils.getPathVal(this.rootFormData, this.curNodePath)
+    };
+  },
+  watch: {
+    rootFormData: {
+      handler(newValue, oldValue) {
+        this.defaultVal = vueUtils.getPathVal(newValue, this.curNodePath)
+      },
+      deep: true
+    },
+    defaultVal: {
+      handler(newValue, oldValue) {
+        // Note: `newValue` will be equal to `oldValue` here
+        // on nested mutations as long as the object itself
+        // hasn't been replaced.
+        vueUtils.setPathVal(this.rootFormData, this.curNodePath, newValue);
+      },
+      deep: true
+    }
+  },
+  methods: {
+    removeVirtioNetwork(index) {
+      this.defaultVal.splice(index, 1);
+    },
+    addVirtioNetwork() {
+      if (!_.isArray(this.defaultVal)) {
+        this.defaultVal = []
+      }
+      this.defaultVal.push({
+        "virtio_framework": this.NetworkFrameworkDefault,
+        "interface_name": "",
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+label:after{
+  content: '*';
+  color: red;
+}
+.ToolSet {
+  display: flex;
+  flex-direction: row-reverse;
+  gap: 8px;
+}
+.ToolSet div{
+  padding: 8px;
+  border: 1px solid rgb(193,193,193);
+  border-radius: 5px;
+}
+.virtio_networks{
+  width: 100%;
+}
+.virtio_network {
+  width: 100%;
+  display: flex;
+  gap: 2rem;
+  align-items: end;
+}
+
+.virtio_network_demo {
+  width: 100%;
+  border: 2px solid #cccccc;
+  padding: 8px 0 12px 6px;
+  border-radius: 5px;
+  margin-bottom: 1rem;
+}
+</style>
\ No newline at end of file