diff --git a/projects/demo/src/app/app.module.ts b/projects/demo/src/app/app.module.ts
index 20115b17..e937aec4 100644
--- a/projects/demo/src/app/app.module.ts
+++ b/projects/demo/src/app/app.module.ts
@@ -18,7 +18,7 @@ import { ShowcaseComponent } from './components/showcase/showcase.component';
 import { DemoThumbsOrientationComponent } from './components/demo-thumbs-orientation/demo-thumbs-orientation.component';
 import { DemoMultipleItemsComponent } from './components/demo-multiple-items/demo-multiple-items.component';
 import { DemoCustomTemplatesComponent } from './components/demo-custom-templates/demo-custom-templates.component';
-import { GalleryModule } from '@daelmaak/ngx-gallery';
+import { GalleryComponent } from '@daelmaak/ngx-gallery';
 
 const materialModules = [
   MatButtonModule,
@@ -46,7 +46,7 @@ const materialModules = [
     BrowserAnimationsModule,
     CommonModule,
     FormsModule,
-    GalleryModule,
+    GalleryComponent,
   ],
   providers: [],
   bootstrap: [AppComponent],
diff --git a/projects/gallery/src/lib/components/counter/counter.component.spec.ts b/projects/gallery/src/lib/components/counter/counter.component.spec.ts
index 86f9b22d..7d529075 100644
--- a/projects/gallery/src/lib/components/counter/counter.component.spec.ts
+++ b/projects/gallery/src/lib/components/counter/counter.component.spec.ts
@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CounterComponent } from './counter.component';
 
@@ -6,12 +6,6 @@ describe('CounterComponent', () => {
   let component: CounterComponent;
   let fixture: ComponentFixture<CounterComponent>;
 
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [CounterComponent],
-    }).compileComponents();
-  }));
-
   beforeEach(() => {
     fixture = TestBed.createComponent(CounterComponent);
     component = fixture.componentInstance;
diff --git a/projects/gallery/src/lib/components/counter/counter.component.ts b/projects/gallery/src/lib/components/counter/counter.component.ts
index a06fbe2d..3ffae74a 100644
--- a/projects/gallery/src/lib/components/counter/counter.component.ts
+++ b/projects/gallery/src/lib/components/counter/counter.component.ts
@@ -16,6 +16,7 @@ import { VerticalOrientation } from '../../core';
   `,
   styleUrls: ['./counter.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
 })
 export class CounterComponent {
   @Input()
diff --git a/projects/gallery/src/lib/components/gallery/gallery.component.spec.ts b/projects/gallery/src/lib/components/gallery/gallery.component.spec.ts
index ac7e2cfd..09dcc0bd 100644
--- a/projects/gallery/src/lib/components/gallery/gallery.component.spec.ts
+++ b/projects/gallery/src/lib/components/gallery/gallery.component.spec.ts
@@ -1,6 +1,5 @@
 import { DebugElement } from '@angular/core';
 import {
-  async,
   ComponentFixture,
   fakeAsync,
   TestBed,
@@ -8,11 +7,6 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { SafePipe } from '../../pipes/safe.pipe';
-import { CounterComponent } from '../counter/counter.component';
-import { ChevronIconComponent } from '../icons/chevron/chevron-icon.component';
-import { ThumbsComponent } from '../thumbs/thumbs.component';
-import { ViewerComponent } from '../viewer/viewer.component';
 import { GalleryComponent } from './gallery.component';
 
 describe('GalleryComponent', () => {
@@ -20,19 +14,11 @@ describe('GalleryComponent', () => {
   let fixture: ComponentFixture<GalleryComponent>;
   let de: DebugElement;
 
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [NoopAnimationsModule],
-      declarations: [
-        GalleryComponent,
-        ViewerComponent,
-        ThumbsComponent,
-        ChevronIconComponent,
-        CounterComponent,
-        SafePipe,
-      ],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(GalleryComponent);
diff --git a/projects/gallery/src/lib/components/gallery/gallery.component.ts b/projects/gallery/src/lib/components/gallery/gallery.component.ts
index b24e84b3..18a0e96b 100644
--- a/projects/gallery/src/lib/components/gallery/gallery.component.ts
+++ b/projects/gallery/src/lib/components/gallery/gallery.component.ts
@@ -1,3 +1,4 @@
+import { CommonModule } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -33,6 +34,8 @@ import { ViewerComponent } from '../viewer/viewer.component';
   templateUrl: './gallery.component.html',
   styleUrls: ['./gallery.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule, ThumbsComponent, ViewerComponent],
 })
 export class GalleryComponent {
   @Input() items: GalleryItem[];
diff --git a/projects/gallery/src/lib/components/icons/chevron/chevron-icon.component.ts b/projects/gallery/src/lib/components/icons/chevron/chevron-icon.component.ts
index 80490b1d..d23f28b2 100644
--- a/projects/gallery/src/lib/components/icons/chevron/chevron-icon.component.ts
+++ b/projects/gallery/src/lib/components/icons/chevron/chevron-icon.component.ts
@@ -5,5 +5,6 @@ import { Component, ChangeDetectionStrategy } from '@angular/core';
   templateUrl: './chevron-icon.component.html',
   styleUrls: ['./chevron-icon.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
 })
 export class ChevronIconComponent {}
diff --git a/projects/gallery/src/lib/components/thumbs/thumbs.component.spec.ts b/projects/gallery/src/lib/components/thumbs/thumbs.component.spec.ts
index 8cda1975..dab52f14 100644
--- a/projects/gallery/src/lib/components/thumbs/thumbs.component.spec.ts
+++ b/projects/gallery/src/lib/components/thumbs/thumbs.component.spec.ts
@@ -6,14 +6,12 @@ import {
 import {
   ComponentFixture,
   TestBed,
-  async,
   fakeAsync,
   flush,
   tick,
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { GalleryItem, SUPPORT } from '../../core';
-import { ChevronIconComponent } from '../icons/chevron/chevron-icon.component';
 import { ThumbsComponent } from './thumbs.component';
 
 describe('ThumbnailsComponent', () => {
@@ -21,15 +19,13 @@ describe('ThumbnailsComponent', () => {
   let fixture: ComponentFixture<ThumbsComponent>;
   let de: DebugElement;
 
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ThumbsComponent, ChevronIconComponent],
-    })
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({})
       .overrideComponent(ThumbsComponent, {
         set: { changeDetection: ChangeDetectionStrategy.Default },
       })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ThumbsComponent);
diff --git a/projects/gallery/src/lib/components/thumbs/thumbs.component.ts b/projects/gallery/src/lib/components/thumbs/thumbs.component.ts
index ece664e0..83611895 100644
--- a/projects/gallery/src/lib/components/thumbs/thumbs.component.ts
+++ b/projects/gallery/src/lib/components/thumbs/thumbs.component.ts
@@ -23,12 +23,16 @@ import {
 } from '../../core';
 import { Aria } from '../../core/aria';
 import { GalleryItemEvent, GalleryItemInternal } from '../../core/gallery-item';
+import { ChevronIconComponent } from '../icons/chevron/chevron-icon.component';
+import { CommonModule } from '@angular/common';
 
 @Component({
   selector: 'thumbs',
   templateUrl: './thumbs.component.html',
   styleUrls: ['./thumbs.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule, ChevronIconComponent],
 })
 export class ThumbsComponent implements OnChanges, OnDestroy {
   @Input() items: GalleryItemInternal[] = [];
diff --git a/projects/gallery/src/lib/components/viewer/viewer.component.spec.ts b/projects/gallery/src/lib/components/viewer/viewer.component.spec.ts
index daa67176..c2f71669 100644
--- a/projects/gallery/src/lib/components/viewer/viewer.component.spec.ts
+++ b/projects/gallery/src/lib/components/viewer/viewer.component.spec.ts
@@ -19,9 +19,6 @@ import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { OrientationFlag } from '../../core';
 import { GalleryItemInternal } from '../../core/gallery-item';
-import { SafePipe } from '../../pipes/safe.pipe';
-import { CounterComponent } from '../counter/counter.component';
-import { ChevronIconComponent } from '../icons/chevron/chevron-icon.component';
 import { ViewerComponent } from './viewer.component';
 
 describe('ViewerComponent', () => {
@@ -32,13 +29,6 @@ describe('ViewerComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       imports: [NoopAnimationsModule],
-      declarations: [
-        ViewerComponent,
-        ChevronIconComponent,
-        CounterComponent,
-        SafePipe,
-        TestCustomTemplatesComponent,
-      ],
     })
       .overrideComponent(ViewerComponent, {
         set: { changeDetection: ChangeDetectionStrategy.Default },
diff --git a/projects/gallery/src/lib/components/viewer/viewer.component.ts b/projects/gallery/src/lib/components/viewer/viewer.component.ts
index a2fd95fa..ec41e433 100644
--- a/projects/gallery/src/lib/components/viewer/viewer.component.ts
+++ b/projects/gallery/src/lib/components/viewer/viewer.component.ts
@@ -33,6 +33,11 @@ import {
   VerticalOrientation,
 } from '../../core';
 import { GalleryItemInternal } from '../../core/gallery-item';
+import { CounterComponent } from '../counter/counter.component';
+import { ChevronIconComponent } from '../icons/chevron/chevron-icon.component';
+import { SafePipe } from '../../pipes/safe.pipe';
+import { CommonModule } from '@angular/common';
+import { MediaDirective } from '../../directives/media.directive';
 
 const passiveEventListenerOpts = {
   passive: true,
@@ -52,6 +57,14 @@ const passiveEventListenerOpts = {
       ]),
     ]),
   ],
+  standalone: true,
+  imports: [
+    CommonModule,
+    CounterComponent,
+    ChevronIconComponent,
+    MediaDirective,
+    SafePipe,
+  ],
 })
 export class ViewerComponent implements OnChanges, OnInit, OnDestroy {
   @Input() items: GalleryItemInternal[];
diff --git a/projects/gallery/src/lib/directives/media.directive.ts b/projects/gallery/src/lib/directives/media.directive.ts
index fcc2a7bc..7d967ff2 100644
--- a/projects/gallery/src/lib/directives/media.directive.ts
+++ b/projects/gallery/src/lib/directives/media.directive.ts
@@ -9,6 +9,7 @@ import {
 
 @Directive({
   selector: '[media]',
+  standalone: true,
 })
 export class MediaDirective implements OnInit, OnDestroy {
   @Output()
diff --git a/projects/gallery/src/lib/gallery.module.ts b/projects/gallery/src/lib/gallery.module.ts
deleted file mode 100644
index 7a62cbd0..00000000
--- a/projects/gallery/src/lib/gallery.module.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
-
-import { CounterComponent } from './components/counter/counter.component';
-import { GalleryComponent } from './components/gallery/gallery.component';
-import { ChevronIconComponent } from './components/icons/chevron/chevron-icon.component';
-import { ThumbsComponent } from './components/thumbs/thumbs.component';
-import { ViewerComponent } from './components/viewer/viewer.component';
-import { SafePipe } from './pipes/safe.pipe';
-import { MediaDirective } from './directives/media.directive';
-
-@NgModule({
-  declarations: [
-    GalleryComponent,
-    ThumbsComponent,
-    ViewerComponent,
-    ChevronIconComponent,
-    CounterComponent,
-    SafePipe,
-    MediaDirective,
-  ],
-  imports: [CommonModule],
-  exports: [GalleryComponent],
-})
-export class GalleryModule {}
diff --git a/projects/gallery/src/lib/pipes/safe.pipe.ts b/projects/gallery/src/lib/pipes/safe.pipe.ts
index b6005418..01c16a5d 100644
--- a/projects/gallery/src/lib/pipes/safe.pipe.ts
+++ b/projects/gallery/src/lib/pipes/safe.pipe.ts
@@ -3,6 +3,7 @@ import { DomSanitizer } from '@angular/platform-browser';
 
 @Pipe({
   name: 'safe',
+  standalone: true,
 })
 export class SafePipe implements PipeTransform {
   constructor(private sanitizer: DomSanitizer) {}
diff --git a/projects/gallery/src/public-api.ts b/projects/gallery/src/public-api.ts
index b78693c1..50e87e83 100644
--- a/projects/gallery/src/public-api.ts
+++ b/projects/gallery/src/public-api.ts
@@ -2,5 +2,4 @@
  * Public API Surface of the gallery
  */
 export * from './lib/components/gallery/gallery.component';
-export * from './lib/gallery.module';
 export * from './lib/core';