diff --git a/src/panel-component/index.ts b/src/panel-component/index.ts
index e712148aed31ca8ddec72acda2bb86935f28928f..1ed29ee547dbb7de3116d6fa7366d9d0f8707dad 100644
--- a/src/panel-component/index.ts
+++ b/src/panel-component/index.ts
@@ -7,6 +7,7 @@ import IBizPanelCtrlPos from './panel-ctrl-pos';
 import IBizScrollContainer from './scroll-container';
 import IBizPanelButton from './panel-button';
 import IBizNavPos from './nav-pos';
+import IBizPanelAppTitle from './panel-app-title';
 
 export * from './panel-container';
 export * from './panel-ctrl-pos';
@@ -15,6 +16,7 @@ export * from './auth-userinfo';
 export * from './nav-pos-index';
 export * from './panel-button';
 export * from './nav-pos';
+export * from './panel-app-title';
 
 export const IBizPanelComponents = {
   install: (v: App) => {
@@ -26,6 +28,7 @@ export const IBizPanelComponents = {
     v.use(IBizNavTabs);
     v.use(IBizPanelButton);
     v.use(IBizNavPos);
+    v.use(IBizPanelAppTitle);
   },
 };
 
diff --git a/src/panel-component/panel-app-title/index.ts b/src/panel-component/panel-app-title/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8e1e3fa02c3c80de57039dd32f1e163ca854d7a1
--- /dev/null
+++ b/src/panel-component/panel-app-title/index.ts
@@ -0,0 +1,18 @@
+import { registerPanelItemProvider } from '@ibiz-template/runtime';
+import { withInstall } from '@ibiz-template/vue3-util';
+import { App } from 'vue';
+import PanelAppTitle from './panel-app-title';
+import { PanelAppTitleProvider } from './panel-app-title.provider';
+
+export * from './panel-app-title.provider';
+export * from './panel-app-title.controller';
+
+export const IBizPanelAppTitle = withInstall(PanelAppTitle, function (v: App) {
+  v.component(PanelAppTitle.name, PanelAppTitle);
+  registerPanelItemProvider(
+    'RAWITEM_APP_APPTITLE',
+    () => new PanelAppTitleProvider(),
+  );
+});
+
+export default IBizPanelAppTitle;
diff --git a/src/panel-component/panel-app-title/panel-app-title.controller.ts b/src/panel-component/panel-app-title/panel-app-title.controller.ts
new file mode 100644
index 0000000000000000000000000000000000000000..9dbc5cd68e3711c146f891e8e19f42eb1162985c
--- /dev/null
+++ b/src/panel-component/panel-app-title/panel-app-title.controller.ts
@@ -0,0 +1,48 @@
+import { IPanelField, IAppIndexView } from '@ibiz/model-core';
+import { PanelItemController, ViewLayoutPanelController } from '../../control';
+import { PanelAppTitleState } from './panel-app-title.state';
+
+/**
+ * 面板应用标题控制器
+ *
+ * @export
+ * @class PanelAppTitleController
+ * @extends {PanelItemController<IPanelField>}
+ */
+export class PanelAppTitleController extends PanelItemController<IPanelField> {
+  declare state: PanelAppTitleState;
+
+  protected createState(): PanelAppTitleState {
+    return new PanelAppTitleState(this.parent?.state);
+  }
+
+  /**
+   * 面板控制器
+   *
+   * @type {ViewLayoutPanelController}
+   * @memberof PanelAppTitleController
+   */
+  declare panel: ViewLayoutPanelController;
+
+  /**
+   * 初始化
+   *
+   * @return {*}  {Promise<void>}
+   * @memberof PanelAppTitleController
+   */
+  async onInit(): Promise<void> {
+    await super.onInit();
+    const indexViewModel: IAppIndexView = this.panel.view.model;
+    // 抬头
+    if (indexViewModel.title) {
+      this.state.title = indexViewModel.title;
+      document.title = indexViewModel.title;
+    } else if (ibiz.env.AppTitle) {
+      this.state.title = ibiz.env.AppTitle;
+    }
+    // 图标路径
+    if (indexViewModel.appIconPath) {
+      this.state.imgUrl = indexViewModel.appIconPath;
+    }
+  }
+}
diff --git a/src/panel-component/panel-app-title/panel-app-title.provider.ts b/src/panel-component/panel-app-title/panel-app-title.provider.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2f555c910f9d282427b4b8cf190faf1959ea0db8
--- /dev/null
+++ b/src/panel-component/panel-app-title/panel-app-title.provider.ts
@@ -0,0 +1,25 @@
+import { IPanelItemProvider } from '@ibiz-template/runtime';
+import { IPanelItem } from '@ibiz/model-core';
+import { PanelController, PanelItemController } from '../../control';
+import { PanelAppTitleController } from './panel-app-title.controller';
+
+/**
+ * 面板应用标题适配器
+ *
+ * @export
+ * @class PanelAppTitleProvider
+ * @implements {IPanelItemProvider}
+ */
+export class PanelAppTitleProvider implements IPanelItemProvider {
+  component: string = 'IBizPanelAppTitle';
+
+  async createController(
+    panelItem: IPanelItem,
+    panel: PanelController,
+    parent: PanelItemController | undefined,
+  ): Promise<PanelAppTitleController> {
+    const c = new PanelAppTitleController(panelItem, panel, parent);
+    await c.init();
+    return c;
+  }
+}
diff --git a/src/panel-component/panel-app-title/panel-app-title.scss b/src/panel-component/panel-app-title/panel-app-title.scss
new file mode 100644
index 0000000000000000000000000000000000000000..fe448eec2f53e524e47a9656e7b8a8b361a7df5d
--- /dev/null
+++ b/src/panel-component/panel-app-title/panel-app-title.scss
@@ -0,0 +1,15 @@
+@include b(panel-app-title) {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  @include e(logo) {
+    display: inline-block;
+    height: 80%;
+    margin-right: 10px;
+
+    img {
+      height: 100%;
+    }
+  }
+}
diff --git a/src/panel-component/panel-app-title/panel-app-title.state.ts b/src/panel-component/panel-app-title/panel-app-title.state.ts
new file mode 100644
index 0000000000000000000000000000000000000000..53812b6eab1f99e224c22cf061388d9b2df2366d
--- /dev/null
+++ b/src/panel-component/panel-app-title/panel-app-title.state.ts
@@ -0,0 +1,28 @@
+import { PanelItemState } from '../../control/panel/panel/panel-item.state';
+
+/**
+ * 面板应用标题状态
+ *
+ * @author lxm
+ * @date 2023-02-07 06:04:27
+ * @export
+ * @class PanelAppTitleState
+ * @extends {PanelItemState}
+ */
+export class PanelAppTitleState extends PanelItemState {
+  /**
+   * 应用标题
+   * @return {*}
+   * @author: zhujiamin
+   * @Date: 2023-06-01 10:29:07
+   */
+  title: string = '';
+
+  /**
+   * 应用logo地址
+   * @return {*}
+   * @author: zhujiamin
+   * @Date: 2023-06-01 10:29:07
+   */
+  imgUrl: string = '';
+}
diff --git a/src/panel-component/panel-app-title/panel-app-title.tsx b/src/panel-component/panel-app-title/panel-app-title.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a06429a8a044440ecedb5f759786498b48155d90
--- /dev/null
+++ b/src/panel-component/panel-app-title/panel-app-title.tsx
@@ -0,0 +1,40 @@
+import { useNamespace } from '@ibiz-template/vue3-util';
+import { IPanelField } from '@ibiz/model-core';
+import { defineComponent, PropType } from 'vue';
+import { PanelAppTitleController } from './panel-app-title.controller';
+import './panel-app-title.scss';
+
+export const PanelAppTitle = defineComponent({
+  name: 'IBizPanelAppTitle',
+  props: {
+    modelData: {
+      type: Object as PropType<IPanelField>,
+      required: true,
+    },
+    controller: {
+      type: PanelAppTitleController,
+      required: true,
+    },
+  },
+  setup(props) {
+    const ns = useNamespace('panel-app-title');
+
+    const c = props.controller;
+
+    return {
+      ns,
+      c,
+    };
+  },
+  render() {
+    return (
+      <div class={this.ns.b()}>
+        <span class={this.ns.e('logo')}>
+          <img src={this.c.state.imgUrl} />
+        </span>
+        <span class={this.ns.e('title')}>{this.c.state.title}</span>
+      </div>
+    );
+  },
+});
+export default PanelAppTitle;