diff --git a/templates/module/angular/projects/my-project-name-config/src/lib/components/my-project-name-settings.component.ts b/templates/module/angular/projects/my-project-name-config/src/lib/components/my-project-name-settings.component.ts
new file mode 100644
index 0000000000..39db5d23d5
--- /dev/null
+++ b/templates/module/angular/projects/my-project-name-config/src/lib/components/my-project-name-settings.component.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'my-project-name-settings',
+  template: `
+    <h3>MyProjectName Settings</h3>
+  `,
+})
+export class MyProjectNameSettingsComponent {}
diff --git a/templates/module/angular/projects/my-project-name-config/src/lib/my-project-name-config.module.ts b/templates/module/angular/projects/my-project-name-config/src/lib/my-project-name-config.module.ts
index e230b3c2c0..1af221be40 100644
--- a/templates/module/angular/projects/my-project-name-config/src/lib/my-project-name-config.module.ts
+++ b/templates/module/angular/projects/my-project-name-config/src/lib/my-project-name-config.module.ts
@@ -1,10 +1,12 @@
 import { NgModule, APP_INITIALIZER } from '@angular/core';
 import { MyProjectNameConfigService } from './services/my-project-name-config.service';
 import { noop } from '@abp/ng.core';
+import { MyProjectNameSettingsComponent } from './components/my-project-name-settings.component';
 
 @NgModule({
-  declarations: [],
+  declarations: [MyProjectNameSettingsComponent],
   providers: [{ provide: APP_INITIALIZER, deps: [MyProjectNameConfigService], multi: true, useFactory: noop }],
-  exports: [],
+  exports: [MyProjectNameSettingsComponent],
+  entryComponents: [MyProjectNameSettingsComponent],
 })
 export class MyProjectNameConfigModule {}
diff --git a/templates/module/angular/projects/my-project-name-config/src/lib/services/my-project-name-config.service.ts b/templates/module/angular/projects/my-project-name-config/src/lib/services/my-project-name-config.service.ts
index 0596ab8711..9cf1443edc 100644
--- a/templates/module/angular/projects/my-project-name-config/src/lib/services/my-project-name-config.service.ts
+++ b/templates/module/angular/projects/my-project-name-config/src/lib/services/my-project-name-config.service.ts
@@ -1,5 +1,7 @@
 import { Injectable } from '@angular/core';
 import { eLayoutType, addAbpRoutes, ABP } from '@abp/ng.core';
+import { addSettingTab } from '@abp/ng.theme.shared';
+import { MyProjectNameSettingsComponent } from '../components/my-project-name-settings.component';
 
 @Injectable({
   providedIn: 'root',
@@ -12,5 +14,12 @@ export class MyProjectNameConfigService {
       layout: eLayoutType.application,
       order: 2,
     } as ABP.FullRoute);
+
+    const route = addSettingTab({
+      component: MyProjectNameSettingsComponent,
+      name: 'MyProjectName Settings',
+      order: 1,
+      requiredPolicy: '',
+    });
   }
 }
diff --git a/templates/module/angular/projects/my-project-name-config/src/public-api.ts b/templates/module/angular/projects/my-project-name-config/src/public-api.ts
index 6d4033b309..e931e6159e 100644
--- a/templates/module/angular/projects/my-project-name-config/src/public-api.ts
+++ b/templates/module/angular/projects/my-project-name-config/src/public-api.ts
@@ -1,2 +1,3 @@
+export * from './lib/components/my-project-name-settings.component';
 export * from './lib/services/my-project-name-config.service';
 export * from './lib/my-project-name-config.module';