diff --git a/core/src/components/badge/test/basic/badge.e2e.ts b/core/src/components/badge/test/basic/badge.e2e.ts
new file mode 100644
index 0000000000..937d46f6ce
--- /dev/null
+++ b/core/src/components/badge/test/basic/badge.e2e.ts
@@ -0,0 +1,12 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('badge: rendering', () => {
+  test('should not have visual regressions', async ({ page }) => {
+    await page.goto('/src/components/badge/test/basic');
+
+    await page.setIonViewport();
+
+    expect(await page.screenshot()).toMatchSnapshot(`badge-basic-${page.getSnapshotSettings()}.png`);
+  });
+});
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..647f15dbc1
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..43d8258205
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..23cfc81c95
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..4957cd69b7
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..9dcec312b4
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..4780e14c33
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..03e19e84aa
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..309a94d5e5
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..01aac9032b
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..7a5295fa2d
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..cf72d30e74
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..b0812bbaee
Binary files /dev/null and b/core/src/components/badge/test/basic/badge.e2e.ts-snapshots/badge-basic-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/basic/e2e.ts b/core/src/components/badge/test/basic/e2e.ts
deleted file mode 100644
index 377ec4050a..0000000000
--- a/core/src/components/badge/test/basic/e2e.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('badge: basic', async () => {
-  const page = await newE2EPage({
-    url: '/src/components/badge/test/basic?ionic:_testing=true',
-  });
-
-  const compare = await page.compareScreenshot();
-  expect(compare).toMatchScreenshot();
-});
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts b/core/src/components/badge/test/standalone/badge.e2e.ts
new file mode 100644
index 0000000000..cd9e7dfe44
--- /dev/null
+++ b/core/src/components/badge/test/standalone/badge.e2e.ts
@@ -0,0 +1,12 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('badge: rendering', () => {
+  test('should not have visual regressions', async ({ page }) => {
+    await page.goto('/src/components/badge/test/standalone');
+
+    await page.setIonViewport();
+
+    expect(await page.screenshot()).toMatchSnapshot(`badge-standalone-${page.getSnapshotSettings()}.png`);
+  });
+});
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..c8ab452a78
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..7712a3e095
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..888aa41fc0
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..4fd16afda2
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..a844f61972
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..b879ccf7a5
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Chrome-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..284663c23d
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Firefox-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..9895fb1cf6
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Safari-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..64d4d55ee5
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Chrome-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..f8de536616
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Firefox-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..003032a206
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Safari-linux.png b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..29e06bf4c9
Binary files /dev/null and b/core/src/components/badge/test/standalone/badge.e2e.ts-snapshots/badge-standalone-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/badge/test/standalone/e2e.ts b/core/src/components/badge/test/standalone/e2e.ts
deleted file mode 100644
index b6feabc8f4..0000000000
--- a/core/src/components/badge/test/standalone/e2e.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('badge: standalone', async () => {
-  const page = await newE2EPage({
-    url: '/src/components/badge/test/standalone?ionic:_testing=true',
-  });
-
-  const compare = await page.compareScreenshot();
-  expect(compare).toMatchScreenshot();
-});