diff --git a/src/dev-app/autocomplete/autocomplete-demo.ts b/src/dev-app/autocomplete/autocomplete-demo.ts
index df610c563088..9e2126477f5d 100644
--- a/src/dev-app/autocomplete/autocomplete-demo.ts
+++ b/src/dev-app/autocomplete/autocomplete-demo.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
+import {JsonPipe} from '@angular/common';
 import {ChangeDetectionStrategy, Component, inject, ViewChild} from '@angular/core';
 import {FormControl, FormsModule, NgModel, ReactiveFormsModule} from '@angular/forms';
 import {MatAutocompleteModule} from '@angular/material/autocomplete';
@@ -36,7 +36,7 @@ type DisableStateOption = 'none' | 'first-middle-last' | 'all';
   styleUrl: 'autocomplete-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
+    JsonPipe,
     FormsModule,
     MatAutocompleteModule,
     MatButtonModule,
@@ -246,7 +246,7 @@ export class AutocompleteDemo {
     }
   `,
   standalone: true,
-  imports: [CommonModule, FormsModule, MatAutocompleteModule, MatButtonModule, MatInputModule],
+  imports: [FormsModule, MatAutocompleteModule, MatButtonModule, MatInputModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AutocompleteDemoExampleDialog {
diff --git a/src/dev-app/badge/badge-demo.ts b/src/dev-app/badge/badge-demo.ts
index 58cbb2bfe8d6..b7ec0853612a 100644
--- a/src/dev-app/badge/badge-demo.ts
+++ b/src/dev-app/badge/badge-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatBadgeModule} from '@angular/material/badge';
@@ -18,7 +17,7 @@ import {MatIconModule} from '@angular/material/icon';
   templateUrl: 'badge-demo.html',
   styleUrl: 'badge-demo.css',
   standalone: true,
-  imports: [CommonModule, FormsModule, MatBadgeModule, MatButtonModule, MatIconModule],
+  imports: [FormsModule, MatBadgeModule, MatButtonModule, MatIconModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class BadgeDemo {
diff --git a/src/dev-app/baseline/baseline-demo.ts b/src/dev-app/baseline/baseline-demo.ts
index 09e2c470a7a2..5e1da01e76cf 100644
--- a/src/dev-app/baseline/baseline-demo.ts
+++ b/src/dev-app/baseline/baseline-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {MatCardModule} from '@angular/material/card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
@@ -22,7 +21,6 @@ import {MatToolbarModule} from '@angular/material/toolbar';
   styleUrl: 'baseline-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     MatCardModule,
     MatCheckboxModule,
     MatFormFieldModule,
diff --git a/src/dev-app/bottom-sheet/bottom-sheet-demo.ts b/src/dev-app/bottom-sheet/bottom-sheet-demo.ts
index 91494fbf05a7..d55d94ae80cc 100644
--- a/src/dev-app/bottom-sheet/bottom-sheet-demo.ts
+++ b/src/dev-app/bottom-sheet/bottom-sheet-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component, TemplateRef, ViewChild, inject} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {
@@ -32,7 +31,6 @@ const defaultConfig = new MatBottomSheetConfig();
   templateUrl: 'bottom-sheet-demo.html',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatBottomSheetModule,
     MatButtonModule,
@@ -80,7 +78,7 @@ export class BottomSheetDemo {
     </mat-nav-list>
   `,
   standalone: true,
-  imports: [CommonModule, MatListModule],
+  imports: [MatListModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ExampleBottomSheet {
diff --git a/src/dev-app/button-toggle/button-toggle-demo.ts b/src/dev-app/button-toggle/button-toggle-demo.ts
index a2e4f1fbd05c..78413b969351 100644
--- a/src/dev-app/button-toggle/button-toggle-demo.ts
+++ b/src/dev-app/button-toggle/button-toggle-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonToggleModule} from '@angular/material/button-toggle';
@@ -18,7 +17,7 @@ import {MatIconModule} from '@angular/material/icon';
   templateUrl: 'button-toggle-demo.html',
   styleUrl: 'button-toggle-demo.css',
   standalone: true,
-  imports: [CommonModule, FormsModule, MatButtonToggleModule, MatCheckboxModule, MatIconModule],
+  imports: [FormsModule, MatButtonToggleModule, MatCheckboxModule, MatIconModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ButtonToggleDemo {
diff --git a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.ts b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.ts
index 2761e64c54d1..0e23f606c7ac 100644
--- a/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.ts
+++ b/src/dev-app/cdk-experimental-combobox/cdk-combobox-demo.ts
@@ -7,13 +7,12 @@
  */
 
 import {CdkComboboxModule} from '@angular/cdk-experimental/combobox';
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 
 @Component({
   templateUrl: 'cdk-combobox-demo.html',
   standalone: true,
-  imports: [CdkComboboxModule, CommonModule],
+  imports: [CdkComboboxModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class CdkComboboxDemo {}
diff --git a/src/dev-app/cdk-menu/cdk-menu-demo.ts b/src/dev-app/cdk-menu/cdk-menu-demo.ts
index 32e35ce8a704..330bcd17e852 100644
--- a/src/dev-app/cdk-menu/cdk-menu-demo.ts
+++ b/src/dev-app/cdk-menu/cdk-menu-demo.ts
@@ -8,7 +8,6 @@
 
 import {CdkMenuModule} from '@angular/cdk/menu';
 import {ConnectedPosition} from '@angular/cdk/overlay';
-import {CommonModule} from '@angular/common';
 import {
   CdkMenuContextExample,
   CdkMenuInlineExample,
@@ -25,7 +24,6 @@ import {ChangeDetectionStrategy, Component} from '@angular/core';
   standalone: true,
   imports: [
     CdkMenuModule,
-    CommonModule,
     CdkMenuStandaloneMenuExample,
     CdkMenuStandaloneStatefulMenuExample,
     CdkMenuMenubarExample,
diff --git a/src/dev-app/checkbox/checkbox-demo.ts b/src/dev-app/checkbox/checkbox-demo.ts
index 873cb272093d..8d5baf1473dc 100644
--- a/src/dev-app/checkbox/checkbox-demo.ts
+++ b/src/dev-app/checkbox/checkbox-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ANIMATION_MODULE_TYPE, ChangeDetectionStrategy, Component, Directive} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MAT_CHECKBOX_DEFAULT_OPTIONS, MatCheckboxModule} from '@angular/material/checkbox';
@@ -51,7 +50,7 @@ export class AnimationsNoop {}
   `,
   templateUrl: 'nested-checklist.html',
   standalone: true,
-  imports: [CommonModule, MatCheckboxModule, FormsModule],
+  imports: [MatCheckboxModule, FormsModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MatCheckboxDemoNestedChecklist {
@@ -104,7 +103,6 @@ export class MatCheckboxDemoNestedChecklist {
   styleUrl: 'checkbox-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatCheckboxModule,
     MatInputModule,
diff --git a/src/dev-app/chips/chips-demo.ts b/src/dev-app/chips/chips-demo.ts
index 92ed3923a2b7..0487e642bd33 100644
--- a/src/dev-app/chips/chips-demo.ts
+++ b/src/dev-app/chips/chips-demo.ts
@@ -8,7 +8,6 @@
 
 import {LiveAnnouncer} from '@angular/cdk/a11y';
 import {COMMA, ENTER} from '@angular/cdk/keycodes';
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -35,7 +34,6 @@ export interface DemoColor {
   styleUrl: 'chips-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatButtonModule,
     MatCardModule,
diff --git a/src/dev-app/connected-overlay/connected-overlay-demo.ts b/src/dev-app/connected-overlay/connected-overlay-demo.ts
index d43e4a2b5590..e3da8012509a 100644
--- a/src/dev-app/connected-overlay/connected-overlay-demo.ts
+++ b/src/dev-app/connected-overlay/connected-overlay-demo.ts
@@ -16,7 +16,6 @@ import {
   VerticalConnectionPos,
 } from '@angular/cdk/overlay';
 import {TemplatePortal} from '@angular/cdk/portal';
-import {CommonModule} from '@angular/common';
 import {CdkOverlayBasicExample} from '@angular/components-examples/cdk/overlay';
 import {
   ChangeDetectionStrategy,
@@ -40,7 +39,6 @@ import {MatRadioModule} from '@angular/material/radio';
   standalone: true,
   imports: [
     CdkOverlayBasicExample,
-    CommonModule,
     FormsModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/src/dev-app/datepicker/datepicker-demo.ts b/src/dev-app/datepicker/datepicker-demo.ts
index c086e7d2935c..ae2891f816b7 100644
--- a/src/dev-app/datepicker/datepicker-demo.ts
+++ b/src/dev-app/datepicker/datepicker-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -18,6 +17,7 @@ import {
   ViewEncapsulation,
   inject,
 } from '@angular/core';
+import {JsonPipe} from '@angular/common';
 import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCheckboxModule} from '@angular/material/checkbox';
@@ -179,7 +179,7 @@ export class CustomHeaderNgContent<D> {
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    CommonModule,
+    JsonPipe,
     FormsModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/src/dev-app/dev-app/dev-app-layout.html b/src/dev-app/dev-app/dev-app-layout.html
index 41f7d99cf947..994d991f9030 100644
--- a/src/dev-app/dev-app/dev-app-layout.html
+++ b/src/dev-app/dev-app/dev-app-layout.html
@@ -32,7 +32,7 @@
     be one level above the density class in the DOM. At the same time, we want the density to apply
     to the toolbar while always keeping it in LTR at the same time.
    -->
-  <main [attr.dir]="state.direction" [ngClass]="getDensityClass()" class="demo-main">
+  <main [attr.dir]="state.direction" [class]="getDensityClass()" class="demo-main">
     <!-- The toolbar should always be in the LTR direction -->
     <mat-toolbar color="primary" dir="ltr">
       <button mat-icon-button (click)="navigation.open('mouse')">
@@ -142,7 +142,7 @@ <h1>Angular Material Demos</h1>
       </div>
     </mat-toolbar>
 
-    <div [ngClass]="getDensityClass()" class="demo-content mat-app-background">
+    <div [class]="getDensityClass()" class="demo-content mat-app-background">
       <ng-content></ng-content>
     </div>
   </main>
diff --git a/src/dev-app/dev-app/dev-app-layout.ts b/src/dev-app/dev-app/dev-app-layout.ts
index 3c2168690c86..34aee599d945 100644
--- a/src/dev-app/dev-app/dev-app-layout.ts
+++ b/src/dev-app/dev-app/dev-app-layout.ts
@@ -7,7 +7,7 @@
  */
 
 import {Direction, Directionality} from '@angular/cdk/bidi';
-import {CommonModule, DOCUMENT} from '@angular/common';
+import {DOCUMENT} from '@angular/common';
 import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -37,7 +37,6 @@ import {DevAppDirectionality} from './dev-app-directionality';
   encapsulation: ViewEncapsulation.None,
   standalone: true,
   imports: [
-    CommonModule,
     MatButtonModule,
     MatIconModule,
     MatListModule,
diff --git a/src/dev-app/dialog/dialog-demo.ts b/src/dev-app/dialog/dialog-demo.ts
index c0eb8c36d903..042071e9cac6 100644
--- a/src/dev-app/dialog/dialog-demo.ts
+++ b/src/dev-app/dialog/dialog-demo.ts
@@ -44,6 +44,7 @@ import {MatSelectModule} from '@angular/material/select';
   encapsulation: ViewEncapsulation.None,
   standalone: true,
   imports: [
+    JsonPipe,
     FormsModule,
     MatButtonModule,
     MatCardModule,
diff --git a/src/dev-app/drag-drop/drag-drop-demo.ts b/src/dev-app/drag-drop/drag-drop-demo.ts
index a4a0b456498f..59f3151d369d 100644
--- a/src/dev-app/drag-drop/drag-drop-demo.ts
+++ b/src/dev-app/drag-drop/drag-drop-demo.ts
@@ -17,7 +17,6 @@ import {
   Point,
   DragRef,
 } from '@angular/cdk/drag-drop';
-import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
@@ -32,7 +31,6 @@ import {MatCheckbox} from '@angular/material/checkbox';
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    CommonModule,
     DragDropModule,
     FormsModule,
     MatFormFieldModule,
diff --git a/src/dev-app/example/example-list.ts b/src/dev-app/example/example-list.ts
index 42d5ab3584a6..ac5bb7effd46 100644
--- a/src/dev-app/example/example-list.ts
+++ b/src/dev-app/example/example-list.ts
@@ -7,7 +7,6 @@
  */
 
 import {BooleanInput, coerceBooleanProperty} from '@angular/cdk/coercion';
-import {CommonModule} from '@angular/common';
 import {EXAMPLE_COMPONENTS} from '@angular/components-examples';
 import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
 import {MatExpansionModule} from '@angular/material/expansion';
@@ -17,7 +16,7 @@ import {Example} from './example';
 @Component({
   selector: 'material-example-list',
   standalone: true,
-  imports: [CommonModule, MatExpansionModule, Example],
+  imports: [MatExpansionModule, Example],
   template: `
     <mat-accordion multi>
       @for (id of ids; track id) {
diff --git a/src/dev-app/example/example.ts b/src/dev-app/example/example.ts
index 832e08bfbb95..0e4c79c7c446 100644
--- a/src/dev-app/example/example.ts
+++ b/src/dev-app/example/example.ts
@@ -17,14 +17,12 @@ import {
   inject,
 } from '@angular/core';
 import {BooleanInput, coerceBooleanProperty} from '@angular/cdk/coercion';
-import {CommonModule} from '@angular/common';
 import {EXAMPLE_COMPONENTS} from '@angular/components-examples';
 import {loadExample} from '@angular/components-examples/private';
 
 @Component({
   selector: 'material-example',
   standalone: true,
-  imports: [CommonModule],
   template: `
     @if (showLabel) {
       <div class="label">
diff --git a/src/dev-app/expansion/expansion-demo.ts b/src/dev-app/expansion/expansion-demo.ts
index d5ce9acbb729..d9529e2a2e1c 100644
--- a/src/dev-app/expansion/expansion-demo.ts
+++ b/src/dev-app/expansion/expansion-demo.ts
@@ -7,7 +7,6 @@
  */
 
 import {CdkAccordionModule} from '@angular/cdk/accordion';
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component, ViewChild} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -30,7 +29,6 @@ import {MatSlideToggleModule} from '@angular/material/slide-toggle';
   standalone: true,
   imports: [
     CdkAccordionModule,
-    CommonModule,
     FormsModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/src/dev-app/focus-trap/focus-trap-demo.ts b/src/dev-app/focus-trap/focus-trap-demo.ts
index c2415d890d8f..c7a7c76d59bf 100644
--- a/src/dev-app/focus-trap/focus-trap-demo.ts
+++ b/src/dev-app/focus-trap/focus-trap-demo.ts
@@ -8,7 +8,6 @@
 
 import {A11yModule, CdkTrapFocus} from '@angular/cdk/a11y';
 import {_supportsShadowDom} from '@angular/cdk/platform';
-import {CommonModule} from '@angular/common';
 import {
   AfterViewInit,
   ChangeDetectionStrategy,
@@ -47,14 +46,7 @@ export class FocusTrapShadowDomDemo {}
   templateUrl: 'focus-trap-demo.html',
   styleUrl: 'focus-trap-demo.css',
   standalone: true,
-  imports: [
-    A11yModule,
-    CommonModule,
-    MatButtonModule,
-    MatCardModule,
-    MatToolbarModule,
-    FocusTrapShadowDomDemo,
-  ],
+  imports: [A11yModule, MatButtonModule, MatCardModule, MatToolbarModule, FocusTrapShadowDomDemo],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FocusTrapDemo implements AfterViewInit {
diff --git a/src/dev-app/google-map/google-map-demo.ts b/src/dev-app/google-map/google-map-demo.ts
index 2b4dc4f17b2a..0a6d2dc8acf6 100644
--- a/src/dev-app/google-map/google-map-demo.ts
+++ b/src/dev-app/google-map/google-map-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -69,7 +68,6 @@ let apiLoadingPromise: Promise<unknown> | null = null;
   styleUrl: 'google-map-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     GoogleMap,
     MapBicyclingLayer,
     MapCircle,
diff --git a/src/dev-app/grid-list/grid-list-demo.ts b/src/dev-app/grid-list/grid-list-demo.ts
index 4c2f13eaa379..3586f9362900 100644
--- a/src/dev-app/grid-list/grid-list-demo.ts
+++ b/src/dev-app/grid-list/grid-list-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -19,14 +18,7 @@ import {MatIconModule} from '@angular/material/icon';
   templateUrl: 'grid-list-demo.html',
   styleUrl: 'grid-list-demo.css',
   standalone: true,
-  imports: [
-    CommonModule,
-    FormsModule,
-    MatButtonModule,
-    MatCardModule,
-    MatGridListModule,
-    MatIconModule,
-  ],
+  imports: [FormsModule, MatButtonModule, MatCardModule, MatGridListModule, MatIconModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class GridListDemo {
diff --git a/src/dev-app/input-modality/input-modality-detector-demo.ts b/src/dev-app/input-modality/input-modality-detector-demo.ts
index fa791f919b8a..4772beae7e2f 100644
--- a/src/dev-app/input-modality/input-modality-detector-demo.ts
+++ b/src/dev-app/input-modality/input-modality-detector-demo.ts
@@ -16,7 +16,6 @@ import {
   inject,
 } from '@angular/core';
 
-import {CommonModule} from '@angular/common';
 import {MatButtonModule} from '@angular/material/button';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
@@ -31,7 +30,6 @@ import {takeUntil} from 'rxjs/operators';
   standalone: true,
   imports: [
     A11yModule,
-    CommonModule,
     MatButtonModule,
     MatFormFieldModule,
     MatInputModule,
diff --git a/src/dev-app/input/input-demo.ts b/src/dev-app/input/input-demo.ts
index 49d5af853834..be785de2430e 100644
--- a/src/dev-app/input/input-demo.ts
+++ b/src/dev-app/input/input-demo.ts
@@ -7,6 +7,7 @@
  */
 
 import {ChangeDetectionStrategy, Component} from '@angular/core';
+import {AsyncPipe} from '@angular/common';
 import {FormControl, Validators, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {
   FloatLabelType,
@@ -14,7 +15,6 @@ import {
   MatFormFieldModule,
 } from '@angular/material/form-field';
 import {ErrorStateMatcher, ThemePalette} from '@angular/material/core';
-import {CommonModule} from '@angular/common';
 import {
   FormFieldCustomControlExample,
   MyTelInput,
@@ -42,7 +42,7 @@ const EMAIL_REGEX = /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    CommonModule,
+    AsyncPipe,
     FormsModule,
     MatAutocompleteModule,
     MatButtonModule,
diff --git a/src/dev-app/layout/layout-demo.ts b/src/dev-app/layout/layout-demo.ts
index 1108cdd9d88c..cde9c5c7f309 100644
--- a/src/dev-app/layout/layout-demo.ts
+++ b/src/dev-app/layout/layout-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {BreakpointObserverOverviewExample} from '@angular/components-examples/cdk/layout';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 
@@ -15,7 +14,7 @@ import {ChangeDetectionStrategy, Component} from '@angular/core';
   templateUrl: 'layout-demo.html',
   styleUrl: 'layout-demo.css',
   standalone: true,
-  imports: [CommonModule, BreakpointObserverOverviewExample],
+  imports: [BreakpointObserverOverviewExample],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class LayoutDemo {}
diff --git a/src/dev-app/list/list-demo.ts b/src/dev-app/list/list-demo.ts
index 2758eed6c5d0..81eb8b22aa57 100644
--- a/src/dev-app/list/list-demo.ts
+++ b/src/dev-app/list/list-demo.ts
@@ -6,8 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, ChangeDetectorRef, Component, inject} from '@angular/core';
+import {JsonPipe} from '@angular/common';
 import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatIconModule} from '@angular/material/icon';
@@ -29,7 +29,7 @@ interface Shoes {
   styleUrl: 'list-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
+    JsonPipe,
     FormsModule,
     MatButtonModule,
     MatIconModule,
diff --git a/src/dev-app/menu/menu-demo.ts b/src/dev-app/menu/menu-demo.ts
index f3d190ae3406..8bd65f737ecc 100644
--- a/src/dev-app/menu/menu-demo.ts
+++ b/src/dev-app/menu/menu-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {MatDividerModule} from '@angular/material/divider';
@@ -19,14 +18,7 @@ import {MatToolbarModule} from '@angular/material/toolbar';
   templateUrl: 'menu-demo.html',
   styleUrl: 'menu-demo.css',
   standalone: true,
-  imports: [
-    CommonModule,
-    MatMenuModule,
-    MatButtonModule,
-    MatToolbarModule,
-    MatIconModule,
-    MatDividerModule,
-  ],
+  imports: [MatMenuModule, MatButtonModule, MatToolbarModule, MatIconModule, MatDividerModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MenuDemo {
diff --git a/src/dev-app/paginator/paginator-demo.ts b/src/dev-app/paginator/paginator-demo.ts
index 710ba36fa0de..aa7d5cac2755 100644
--- a/src/dev-app/paginator/paginator-demo.ts
+++ b/src/dev-app/paginator/paginator-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {
   PaginatorConfigurableExample,
   PaginatorOverviewExample,
@@ -25,7 +24,6 @@ import {MatSlideToggleModule} from '@angular/material/slide-toggle';
   styleUrl: 'paginator-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatCardModule,
     MatFormFieldModule,
diff --git a/src/dev-app/performance/performance-demo.ts b/src/dev-app/performance/performance-demo.ts
index 0024d9739a8e..2db4936ebc77 100644
--- a/src/dev-app/performance/performance-demo.ts
+++ b/src/dev-app/performance/performance-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {
   afterNextRender,
   AfterViewInit,
@@ -34,7 +33,6 @@ import {MatTableDataSource, MatTableModule} from '@angular/material/table';
   styleUrl: 'performance-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatButtonModule,
     MatDividerModule,
diff --git a/src/dev-app/platform/platform-demo.ts b/src/dev-app/platform/platform-demo.ts
index 62e5ca35cc69..72685c5c071e 100644
--- a/src/dev-app/platform/platform-demo.ts
+++ b/src/dev-app/platform/platform-demo.ts
@@ -8,13 +8,11 @@
 
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {Platform, getSupportedInputTypes} from '@angular/cdk/platform';
-import {CommonModule} from '@angular/common';
 
 @Component({
   selector: 'platform-demo',
   templateUrl: 'platform-demo.html',
   standalone: true,
-  imports: [CommonModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class PlatformDemo {
diff --git a/src/dev-app/progress-bar/progress-bar-demo.ts b/src/dev-app/progress-bar/progress-bar-demo.ts
index 30efb4faef2f..078d36cbb0b7 100644
--- a/src/dev-app/progress-bar/progress-bar-demo.ts
+++ b/src/dev-app/progress-bar/progress-bar-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -19,13 +18,7 @@ import {MatProgressBarModule} from '@angular/material/progress-bar';
   templateUrl: 'progress-bar-demo.html',
   styleUrl: 'progress-bar-demo.css',
   standalone: true,
-  imports: [
-    CommonModule,
-    FormsModule,
-    MatProgressBarModule,
-    MatButtonModule,
-    MatButtonToggleModule,
-  ],
+  imports: [FormsModule, MatProgressBarModule, MatButtonModule, MatButtonToggleModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ProgressBarDemo {
diff --git a/src/dev-app/radio/radio-demo.ts b/src/dev-app/radio/radio-demo.ts
index b907aeebd344..b090b2bac861 100644
--- a/src/dev-app/radio/radio-demo.ts
+++ b/src/dev-app/radio/radio-demo.ts
@@ -7,7 +7,6 @@
  */
 
 import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCheckboxModule} from '@angular/material/checkbox';
@@ -19,14 +18,7 @@ import {MatTooltip} from '@angular/material/tooltip';
   templateUrl: 'radio-demo.html',
   styleUrl: 'radio-demo.css',
   standalone: true,
-  imports: [
-    CommonModule,
-    MatRadioModule,
-    FormsModule,
-    MatButtonModule,
-    MatCheckboxModule,
-    MatTooltip,
-  ],
+  imports: [MatRadioModule, FormsModule, MatButtonModule, MatCheckboxModule, MatTooltip],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class RadioDemo {
diff --git a/src/dev-app/screen-type/screen-type-demo.ts b/src/dev-app/screen-type/screen-type-demo.ts
index 75919d2bbdb1..f1901a382331 100644
--- a/src/dev-app/screen-type/screen-type-demo.ts
+++ b/src/dev-app/screen-type/screen-type-demo.ts
@@ -7,8 +7,8 @@
  */
 
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
+import {AsyncPipe} from '@angular/common';
 import {BreakpointObserver, BreakpointState, Breakpoints, LayoutModule} from '@angular/cdk/layout';
-import {CommonModule} from '@angular/common';
 import {MatGridListModule} from '@angular/material/grid-list';
 import {MatIconModule} from '@angular/material/icon';
 import {Observable} from 'rxjs';
@@ -18,7 +18,7 @@ import {Observable} from 'rxjs';
   templateUrl: 'screen-type-demo.html',
   styleUrl: 'screen-type-demo.css',
   standalone: true,
-  imports: [CommonModule, LayoutModule, MatGridListModule, MatIconModule],
+  imports: [AsyncPipe, LayoutModule, MatGridListModule, MatIconModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ScreenTypeDemo {
diff --git a/src/dev-app/select/select-demo.ts b/src/dev-app/select/select-demo.ts
index 32963c7b3570..cf78c628222c 100644
--- a/src/dev-app/select/select-demo.ts
+++ b/src/dev-app/select/select-demo.ts
@@ -6,8 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
+import {JsonPipe} from '@angular/common';
 import {FormControl, FormsModule, ReactiveFormsModule, Validators} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCardModule} from '@angular/material/card';
@@ -36,7 +36,7 @@ type DisableDrinkOption = 'none' | 'first-middle-last' | 'all';
   styleUrl: 'select-demo.css',
   standalone: true,
   imports: [
-    CommonModule,
+    JsonPipe,
     FormsModule,
     MatButtonModule,
     MatCardModule,
diff --git a/src/dev-app/sidenav/sidenav-demo.ts b/src/dev-app/sidenav/sidenav-demo.ts
index 6a924af2517a..24ec1648f808 100644
--- a/src/dev-app/sidenav/sidenav-demo.ts
+++ b/src/dev-app/sidenav/sidenav-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -19,14 +18,7 @@ import {MatToolbarModule} from '@angular/material/toolbar';
   templateUrl: 'sidenav-demo.html',
   styleUrl: 'sidenav-demo.css',
   standalone: true,
-  imports: [
-    CommonModule,
-    FormsModule,
-    MatButtonModule,
-    MatCheckboxModule,
-    MatSidenavModule,
-    MatToolbarModule,
-  ],
+  imports: [FormsModule, MatButtonModule, MatCheckboxModule, MatSidenavModule, MatToolbarModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SidenavDemo {
diff --git a/src/dev-app/snack-bar/snack-bar-demo.ts b/src/dev-app/snack-bar/snack-bar-demo.ts
index d32fe8c7c434..192fbb0be33c 100644
--- a/src/dev-app/snack-bar/snack-bar-demo.ts
+++ b/src/dev-app/snack-bar/snack-bar-demo.ts
@@ -7,7 +7,6 @@
  */
 
 import {Directionality} from '@angular/cdk/bidi';
-import {CommonModule} from '@angular/common';
 import {
   ChangeDetectionStrategy,
   Component,
@@ -34,14 +33,7 @@ import {
   styleUrl: 'snack-bar-demo.css',
   encapsulation: ViewEncapsulation.None,
   standalone: true,
-  imports: [
-    CommonModule,
-    FormsModule,
-    MatButtonModule,
-    MatCheckboxModule,
-    MatInputModule,
-    MatSelectModule,
-  ],
+  imports: [FormsModule, MatButtonModule, MatCheckboxModule, MatInputModule, MatSelectModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SnackBarDemo {
diff --git a/src/dev-app/stepper/stepper-demo.ts b/src/dev-app/stepper/stepper-demo.ts
index 02c216df49f8..087d0478bc69 100644
--- a/src/dev-app/stepper/stepper-demo.ts
+++ b/src/dev-app/stepper/stepper-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {
   AbstractControl,
@@ -28,7 +27,6 @@ import {MatStepperModule} from '@angular/material/stepper';
   templateUrl: 'stepper-demo.html',
   standalone: true,
   imports: [
-    CommonModule,
     FormsModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/src/dev-app/table-scroll-container/table-scroll-container-demo.ts b/src/dev-app/table-scroll-container/table-scroll-container-demo.ts
index 80f059b5c4b1..339a5d67ab3e 100644
--- a/src/dev-app/table-scroll-container/table-scroll-container-demo.ts
+++ b/src/dev-app/table-scroll-container/table-scroll-container-demo.ts
@@ -7,7 +7,6 @@
  */
 
 import {CdkTableScrollContainerModule} from '@angular/cdk-experimental/table-scroll-container';
-import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {MatButtonToggleGroup, MatButtonToggleModule} from '@angular/material/button-toggle';
@@ -21,13 +20,7 @@ import {MatTableModule} from '@angular/material/table';
   styleUrl: 'table-scroll-container-demo.css',
   templateUrl: 'table-scroll-container-demo.html',
   standalone: true,
-  imports: [
-    CdkTableScrollContainerModule,
-    CommonModule,
-    MatButtonModule,
-    MatButtonToggleModule,
-    MatTableModule,
-  ],
+  imports: [CdkTableScrollContainerModule, MatButtonModule, MatButtonToggleModule, MatTableModule],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class TableScrollContainerDemo {
diff --git a/src/dev-app/tree/tree-demo.ts b/src/dev-app/tree/tree-demo.ts
index c067dbb614ad..7cd02054b962 100644
--- a/src/dev-app/tree/tree-demo.ts
+++ b/src/dev-app/tree/tree-demo.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 import {CdkTreeModule} from '@angular/cdk/tree';
-import {CommonModule} from '@angular/common';
 import {
   CdkTreeFlatExample,
   CdkTreeNestedExample,
@@ -53,7 +52,6 @@ import {MatTreeModule} from '@angular/material/tree';
     CdkTreeNestedChildrenAccessorExample,
     CdkTreeNestedLevelAccessorExample,
     CdkTreeComplexExample,
-    CommonModule,
     FormsModule,
     TreeDynamicExample,
     TreeFlatChildAccessorOverviewExample,
diff --git a/src/dev-app/virtual-scroll/virtual-scroll-demo.ts b/src/dev-app/virtual-scroll/virtual-scroll-demo.ts
index 49fd0b5a38d8..ff570348f0a7 100644
--- a/src/dev-app/virtual-scroll/virtual-scroll-demo.ts
+++ b/src/dev-app/virtual-scroll/virtual-scroll-demo.ts
@@ -7,9 +7,9 @@
  */
 
 import {ChangeDetectionStrategy, Component, OnDestroy, ViewEncapsulation} from '@angular/core';
+import {AsyncPipe} from '@angular/common';
 import {CdkVirtualScrollViewport, ScrollingModule} from '@angular/cdk/scrolling';
 import {ScrollingModule as ExperimentalScrollingModule} from '@angular/cdk-experimental/scrolling';
-import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatFormFieldModule} from '@angular/material/form-field';
@@ -34,7 +34,7 @@ type State = {
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    CommonModule,
+    AsyncPipe,
     ExperimentalScrollingModule,
     FormsModule,
     MatButtonModule,