diff --git a/projects/demo/src/modules/app/app.routes.ts b/projects/demo/src/modules/app/app.routes.ts
index f3151df8578c..4d7c7f766452 100644
--- a/projects/demo/src/modules/app/app.routes.ts
+++ b/projects/demo/src/modules/app/app.routes.ts
@@ -123,14 +123,11 @@ export const ROUTES: Routes = [
         title: 'Avatar',
         loadComponent: async () => import('../components/avatar/avatar.component'),
     }),
-    {
+    route({
         path: 'components/badge',
-        loadChildren: async () =>
-            (await import('../components/badge/badge.module')).ExampleTuiBadgeModule,
-        data: {
-            title: 'Badge',
-        },
-    },
+        loadComponent: async () => import('../components/badge/badge.component'),
+        title: 'Badge',
+    }),
     {
         path: 'components/badged-content',
         loadChildren: async () =>
diff --git a/projects/demo/src/modules/components/badge/badge.component.ts b/projects/demo/src/modules/components/badge/badge.component.ts
index 8aa0ee5f2e1d..368c34c67f1b 100644
--- a/projects/demo/src/modules/components/badge/badge.component.ts
+++ b/projects/demo/src/modules/components/badge/badge.component.ts
@@ -1,14 +1,55 @@
+import {NgIf} from '@angular/common';
 import {Component} from '@angular/core';
+import {FormsModule} from '@angular/forms';
 import {changeDetection} from '@demo/emulate/change-detection';
-import type {TuiRawLoaderContent} from '@taiga-ui/addon-doc';
-import type {TuiSizeS, TuiSizeXL} from '@taiga-ui/core';
+import {TuiExamplePipe} from '@demo/utils';
+import {
+    TuiDocCodeModule,
+    TuiDocDemoModule,
+    TuiDocDocumentationModule,
+    TuiDocExampleModule,
+    TuiDocPageModule,
+    type TuiRawLoaderContent,
+} from '@taiga-ui/addon-doc';
+import {TuiLabelModule, type TuiSizeS, type TuiSizeXL} from '@taiga-ui/core';
+import {TuiBadgeDirective, TuiFadeDirective, TuiRadioListModule} from '@taiga-ui/kit';
+
+import {TuiBadgeExample1} from './examples/1';
+import {TuiBadgeExample2} from './examples/2';
+import {TuiBadgeExample3} from './examples/3';
+import {TuiBadgeExample4} from './examples/4';
+import {TuiBadgeExample5} from './examples/5';
+import {TuiBadgeExample6} from './examples/6';
 
 @Component({
+    standalone: true,
     selector: 'example-badge',
+    imports: [
+        TuiExamplePipe,
+        TuiBadgeDirective,
+        NgIf,
+        TuiFadeDirective,
+        TuiLabelModule,
+        TuiRadioListModule,
+        FormsModule,
+
+        TuiBadgeExample1,
+        TuiBadgeExample2,
+        TuiBadgeExample3,
+        TuiBadgeExample4,
+        TuiBadgeExample5,
+        TuiBadgeExample6,
+
+        TuiDocCodeModule,
+        TuiDocExampleModule,
+        TuiDocPageModule,
+        TuiDocDemoModule,
+        TuiDocDocumentationModule,
+    ],
     templateUrl: './badge.template.html',
     changeDetection,
 })
-export class ExampleTuiBadgeComponent {
+export default class ExampleTuiBadgeComponent {
     protected readonly exampleModule: TuiRawLoaderContent = import(
         './examples/import/import-module.md?raw'
     );
diff --git a/projects/demo/src/modules/components/badge/badge.module.ts b/projects/demo/src/modules/components/badge/badge.module.ts
deleted file mode 100644
index e043b711a5a0..000000000000
--- a/projects/demo/src/modules/components/badge/badge.module.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import {CommonModule} from '@angular/common';
-import {NgModule} from '@angular/core';
-import {FormsModule} from '@angular/forms';
-import {TuiExamplePipe} from '@demo/utils';
-import {tuiGetDocModules} from '@taiga-ui/addon-doc';
-import {TuiPlatformModule, TuiRepeatTimesModule} from '@taiga-ui/cdk';
-import {
-    TuiLabelModule,
-    TuiModeModule,
-    TuiNotificationModule,
-    TuiTextfieldControllerModule,
-} from '@taiga-ui/core';
-import {TuiIconModule} from '@taiga-ui/experimental';
-import {TuiBadgeDirective, TuiFadeDirective, TuiRadioListModule} from '@taiga-ui/kit';
-
-import {ExampleTuiBadgeComponent} from './badge.component';
-import {TuiBadgeExample1} from './examples/1';
-import {TuiBadgeExample2} from './examples/2';
-import {TuiBadgeExample3} from './examples/3';
-import {TuiBadgeExample4} from './examples/4';
-import {TuiBadgeExample5} from './examples/5';
-import {TuiBadgeExample6} from './examples/6';
-
-@NgModule({
-    imports: [
-        TuiBadgeDirective,
-        TuiModeModule,
-        TuiRepeatTimesModule,
-        TuiIconModule,
-        TuiRadioListModule,
-        FormsModule,
-        CommonModule,
-        TuiFadeDirective,
-        TuiNotificationModule,
-        TuiBadgeDirective,
-        TuiTextfieldControllerModule,
-        TuiLabelModule,
-        tuiGetDocModules(ExampleTuiBadgeComponent),
-        TuiPlatformModule,
-        TuiExamplePipe,
-    ],
-    declarations: [
-        ExampleTuiBadgeComponent,
-        TuiBadgeExample1,
-        TuiBadgeExample2,
-        TuiBadgeExample3,
-        TuiBadgeExample4,
-        TuiBadgeExample5,
-        TuiBadgeExample6,
-    ],
-    exports: [ExampleTuiBadgeComponent],
-})
-export class ExampleTuiBadgeModule {}
diff --git a/projects/demo/src/modules/components/badge/examples/1/index.ts b/projects/demo/src/modules/components/badge/examples/1/index.ts
index 5ee2fa1aebb0..f5ccd43dcbfb 100644
--- a/projects/demo/src/modules/components/badge/examples/1/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/1/index.ts
@@ -1,9 +1,13 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiRepeatTimesModule} from '@taiga-ui/cdk';
+import {TuiBadgeDirective} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-1',
+    imports: [TuiBadgeDirective, TuiRepeatTimesModule],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,
diff --git a/projects/demo/src/modules/components/badge/examples/2/index.ts b/projects/demo/src/modules/components/badge/examples/2/index.ts
index 6afbf70e7933..22502e178986 100644
--- a/projects/demo/src/modules/components/badge/examples/2/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/2/index.ts
@@ -1,9 +1,12 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiBadgeDirective} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-2',
+    imports: [TuiBadgeDirective],
     templateUrl: './index.html',
     encapsulation,
     changeDetection,
diff --git a/projects/demo/src/modules/components/badge/examples/3/index.ts b/projects/demo/src/modules/components/badge/examples/3/index.ts
index c39910801b58..abd68f1f8d94 100644
--- a/projects/demo/src/modules/components/badge/examples/3/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/3/index.ts
@@ -1,9 +1,14 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiPlatformModule} from '@taiga-ui/cdk';
+import {TuiIconModule} from '@taiga-ui/experimental';
+import {TuiBadgeDirective} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-3',
+    imports: [TuiBadgeDirective, TuiPlatformModule, TuiIconModule],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,
diff --git a/projects/demo/src/modules/components/badge/examples/4/index.ts b/projects/demo/src/modules/components/badge/examples/4/index.ts
index 53914da11988..9419d1b9d45a 100644
--- a/projects/demo/src/modules/components/badge/examples/4/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/4/index.ts
@@ -1,9 +1,12 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiBadgeDirective, TuiFadeDirective} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-4',
+    imports: [TuiBadgeDirective, TuiFadeDirective],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,
diff --git a/projects/demo/src/modules/components/badge/examples/5/index.ts b/projects/demo/src/modules/components/badge/examples/5/index.ts
index 160af408e32d..d2bd6ffa043b 100644
--- a/projects/demo/src/modules/components/badge/examples/5/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/5/index.ts
@@ -1,9 +1,12 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiBadgeDirective} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-5',
+    imports: [TuiBadgeDirective],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,
diff --git a/projects/demo/src/modules/components/badge/examples/6/index.ts b/projects/demo/src/modules/components/badge/examples/6/index.ts
index f2e1f5c56bf0..d794712a3313 100644
--- a/projects/demo/src/modules/components/badge/examples/6/index.ts
+++ b/projects/demo/src/modules/components/badge/examples/6/index.ts
@@ -1,10 +1,12 @@
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
-import {tuiBadgeOptionsProvider} from '@taiga-ui/kit';
+import {TuiBadgeDirective, tuiBadgeOptionsProvider} from '@taiga-ui/kit';
 
 @Component({
+    standalone: true,
     selector: 'tui-badge-example-6',
+    imports: [TuiBadgeDirective],
     templateUrl: './index.html',
     encapsulation,
     changeDetection,