diff --git a/src/components/XnWorkflow/components/navTitle.vue b/src/components/XnWorkflow/components/navTitle.vue
new file mode 100644
index 00000000..69f4c664
--- /dev/null
+++ b/src/components/XnWorkflow/components/navTitle.vue
@@ -0,0 +1,32 @@
+<template>
+    <div class="nav_title" :style="{ borderLeft: `4px solid ${borderColor}` }">
+        <p><slot name="nav_name"></slot></p>
+    </div>
+</template>
+<script>
+import { useConfig } from '@/stores/config'
+export default {
+    components: {},
+    data() {
+        return {
+            borderColor: ''
+        }
+    },
+    mounted() {
+        const configStore = useConfig()
+        this.borderColor = configStore.getColorVal('elementUiPrimary')
+    },
+    methods: {}
+}
+</script>
+<style lang="scss" scoped>
+.nav_title {
+    padding-left: 8px;
+    margin-top: 10px;
+    p {
+        font-size: 15px;
+        color: #212121;
+        font-weight: 600;
+    }
+}
+</style>