diff --git a/npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts b/npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts
index f922288f31..de0c75c2ef 100644
--- a/npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts
+++ b/npm/ng-packs/packages/schematics/src/commands/change-theme/index.ts
@@ -15,6 +15,7 @@ import {
 import { ThemeOptionsEnum } from './theme-options.enum';
 import {
   addImportToModule,
+  addProviderToModule,
   findNodes,
   getDecoratorMetadata,
   getMetadataField,
@@ -49,8 +50,7 @@ function updateProjectStyle(
     throw new SchematicsException('The target project does not selected');
   }
 
-  const isProjectLibrary = isLibrary(project);
-  if (isProjectLibrary) {
+  if (isLibrary(project)) {
     throw new SchematicsException('The library project does not supported');
   }
 
@@ -73,7 +73,9 @@ function updateAppModule(selectedProject: string, targetThemeName: ThemeOptionsE
     return chain([
       removeImportPath(appModulePath, targetThemeName),
       removeImportFromNgModuleMetadata(appModulePath, targetThemeName),
+      removeProviderFromNgModuleMetadata(appModulePath, targetThemeName),
       insertImports(appModulePath, targetThemeName),
+      insertProviders(appModulePath, targetThemeName),
     ]);
   };
 }
@@ -151,6 +153,45 @@ export function removeImportFromNgModuleMetadata(
   };
 }
 
+export function removeProviderFromNgModuleMetadata(
+  appModulePath: string,
+  selectedTheme: ThemeOptionsEnum,
+): Rule {
+  return (host: Tree) => {
+    const recorder = host.beginUpdate(appModulePath);
+    const source = createSourceFile(host, appModulePath);
+    const impMap = getImportPaths(selectedTheme, true);
+
+    const node = getDecoratorMetadata(source, 'NgModule', '@angular/core')[0] || {};
+    if (!node) {
+      throw new SchematicsException('The app module does not found');
+    }
+
+    const matchingProperties = getMetadataField(node as ts.ObjectLiteralExpression, 'providers');
+    const assignment = matchingProperties[0] as ts.PropertyAssignment;
+    const assignmentInit = assignment.initializer as ts.ArrayLiteralExpression;
+
+    const elements = assignmentInit.elements;
+    if (!elements || elements.length < 1) {
+      throw new SchematicsException(`Elements could not found: ${elements}`);
+    }
+
+    const filteredElements = elements.filter(f =>
+      impMap.filter(f => !!f.provider).some(s => f.getText().match(s.provider!)),
+    );
+
+    if (!filteredElements || filteredElements.length < 1) {
+      return;
+    }
+
+    filteredElements.map(willRemoveModule => {
+      recorder.remove(willRemoveModule.getStart(), willRemoveModule.getWidth());
+    });
+    host.commitUpdate(recorder);
+    return host;
+  };
+}
+
 export function insertImports(appModulePath: string, selectedTheme: ThemeOptionsEnum): Rule {
   return (host: Tree) => {
     const recorder = host.beginUpdate(appModulePath);
@@ -170,7 +211,7 @@ export function insertImports(appModulePath: string, selectedTheme: ThemeOptions
     if (changes.length > 0) {
       for (const change of changes) {
         if (change instanceof InsertChange) {
-          recorder.insertLeft(change.pos, change.toAdd);
+          recorder.insertLeft(change.order, change.toAdd);
         }
       }
     }
@@ -179,6 +220,35 @@ export function insertImports(appModulePath: string, selectedTheme: ThemeOptions
   };
 }
 
+export function insertProviders(appModulePath: string, selectedTheme: ThemeOptionsEnum): Rule {
+  return (host: Tree) => {
+    const recorder = host.beginUpdate(appModulePath);
+    const source = createSourceFile(host, appModulePath);
+    const selected = importMap.get(selectedTheme);
+
+    if (!selected) {
+      return host;
+    }
+
+    const changes: Change[] = [];
+
+    selected.map(({ path, provider }) => {
+      if (provider) {
+        changes.push(...addProviderToModule(source, appModulePath, provider + '()', path));
+      }
+    });
+
+    for (const change of changes) {
+      if (change instanceof InsertChange) {
+        recorder.insertLeft(change.order, change.toAdd);
+      }
+    }
+
+    host.commitUpdate(recorder);
+    return host;
+  };
+}
+
 export function createSourceFile(host: Tree, appModulePath: string): ts.SourceFile {
   const buffer = host.read(appModulePath);
   if (!buffer || buffer.length === 0) {
diff --git a/npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts b/npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts
index 4bf4300a2b..7dc9bf8053 100644
--- a/npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts
+++ b/npm/ng-packs/packages/schematics/src/commands/change-theme/style-map.ts
@@ -11,6 +11,7 @@ export type StyleDefinition =
 export type ImportDefinition = {
   path: string;
   importName: string;
+  provider?: string;
 };
 
 export const styleMap = new Map<ThemeOptionsEnum, StyleDefinition[]>();
@@ -267,14 +268,16 @@ export const importMap = new Map<ThemeOptionsEnum, ImportDefinition[]>();
 importMap.set(ThemeOptionsEnum.Basic, [
   {
     path: '@abp/ng.theme.basic',
-    importName: 'ThemeBasicModule.forRoot()',
+    importName: 'ThemeBasicModule',
+    provider: 'provideThemeBasicConfig',
   },
 ]);
 
 importMap.set(ThemeOptionsEnum.Lepton, [
   {
     path: '@volo/abp.ng.theme.lepton',
-    importName: 'ThemeLeptonModule.forRoot()',
+    importName: 'ThemeLeptonModule',
+    provider: 'provideThemeLepton',
   },
 ]);
 
diff --git a/npm/ng-packs/packages/schematics/src/utils/angular/ast-utils.ts b/npm/ng-packs/packages/schematics/src/utils/angular/ast-utils.ts
index 55477b41d3..d435b90c85 100644
--- a/npm/ng-packs/packages/schematics/src/utils/angular/ast-utils.ts
+++ b/npm/ng-packs/packages/schematics/src/utils/angular/ast-utils.ts
@@ -399,7 +399,12 @@ export function addSymbolToNgModuleMetadata(
     if (importPath !== null) {
       return [
         new InsertChange(ngModulePath, position, toInsert),
-        insertImport(source, ngModulePath, symbolName.replace(/\..*$/, ''), importPath),
+        insertImport(
+          source,
+          ngModulePath,
+          symbolName.replace(/\..*$/, '').replace(/\(\)/, ''),
+          importPath,
+        ),
       ];
     } else {
       return [new InsertChange(ngModulePath, position, toInsert)];
@@ -449,7 +454,12 @@ export function addSymbolToNgModuleMetadata(
   if (importPath !== null) {
     return [
       new InsertChange(ngModulePath, position, toInsert),
-      insertImport(source, ngModulePath, symbolName.replace(/\..*$/, ''), importPath),
+      insertImport(
+        source,
+        ngModulePath,
+        symbolName.replace(/\..*$/, '').replace(/\(\)/, ''),
+        importPath,
+      ),
     ];
   }