diff --git a/.eslintrc.js b/.eslintrc.js
index 603bbd84a..073412ac4 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -12,7 +12,7 @@ module.exports = {
   globals: {
     BufferEncoding: 'readonly',
   },
-  ignorePatterns: ['**/dist/**', '*.hbs', 'scripts/**', '**/husky/**'],
+  ignorePatterns: ['**/dist/**', '*.hbs', 'scripts/**', '**/husky/**', '**/Dockerfile.*'],
   overrides: [
     {
       files: ['**/*.test.ts'],
diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml
index 7077fe2bc..255bc4f62 100644
--- a/.github/workflows/pull-request.yml
+++ b/.github/workflows/pull-request.yml
@@ -344,14 +344,16 @@ jobs:
       - name: Synchronize Packages
         run: yarn
 
-      - name: Install Playwright
-        run: |
-          if [ ${{ matrix.package }} == '@momentum-design/components' ]; then
-            yarn workspace @momentum-design/components test:e2e:install
-          fi
+      - name: Log in to GitHub Container Registry
+        if: ${{ matrix.package == '@momentum-design/components' }}
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Test - Postbuild
-        run: yarn workspace ${{ matrix.package }} test:postbuild
+        run: yarn workspace ${{ matrix.package }} test:postbuild  
 
       - name: Upload Playwright Report
         uses: actions/upload-artifact@v4
@@ -359,4 +361,4 @@ jobs:
         with:
           name: playwright-report
           path: packages/components/playwright-report/
-          retention-days: 30
+          retention-days: 30
\ No newline at end of file
diff --git a/packages/components/TESTING.md b/packages/components/TESTING.md
index 89720ac6a..02396a9ec 100644
--- a/packages/components/TESTING.md
+++ b/packages/components/TESTING.md
@@ -2,8 +2,7 @@
 
 ## E2E Testing
 
-Testing of the mounted, built component in real browsers.
-E2E Testing is done with the help of [Playwright](https://playwright.dev/).
+`@momentum-design/components` utilizes [Playwright](https://playwright.dev/) as the core end-to-end testing framework to ensure continuous functionality during development. Our e2e tests focus on functionality rather than code coverage to strike a balance between quick feedback and usability.
 
 ### Scope
 
@@ -21,22 +20,158 @@ E2E Testing is done with the help of [Playwright](https://playwright.dev/).
 * Edge
 * Safari/webkit
 
+#### Setup
+
+`@momentum-design/components` project performs visual comparisons and functionality testing for all components. There are different setups for local environments versus GitHub Workflow:
+
+* On Local:
+  * You can run functional tests locally (for easier debugging) or in Docker.
+  * Update snapshot images (golden images) only using Docker with the official Playwright image, via the provided yarn scripts.
+  * Uses `playwright.config.ts`, relying on local and a web server.
+* On Github Workflow:
+  * GitHub Workflow build the Playwright Docker image to run all tests, including snapshot tests.
+* Playwright projects:
+  * Default = Functional tests and Snapshot tests (Docker required)
+  * Skip Snapshot = Snapshot tests (Recommend for local)
+
 ### Local development
 
 For the best local development experience, the following E2E setup testing is recommended:
 
-1. Open 2 terminals
-2. In the first terminal, run `yarn components test:e2e:setup`
-    * This will spin up the local dev environment with dev server
-    * Wait till a `Serving!` message appears
-3. In the second terminal, run `yarn components test:e2e`
-    * This allows to run all E2E tests
-    * To run a specific E2E test, run `yarn components test:e2e XXX`
-    * To run the tests in `headed mode`, run `yarn components test:e2e --headed`
+1. In the terminal, run:
+
+   ```bash
+     yarn components test:e2e:install # install all browsers for playwright to run on local
+     # you don't have to install if you already have them
+   ```
+
+2. Once the install completes, setup the webserver:
+
+   ```bash
+     yarn components test:e2e:serve # setup server on localhost:4000
+   ```
+
+3. Open another terminal, now you can start run the test:
+
+   ```bash
+     yarn components test:e2e:skip-snapshot # without snapshot 
+     # if you want to test the snapshot, please see Docker Testing
+   ```
+
+   * To run the tests in `headed mode`, run:
+
+   ```bash
+     yarn components test:e2e:skip-snapshot -- --headed # without snapshot
+   ```
+
+4. To Run **single** E2E Test file, run:
+
+   ```bash
+     yarn components test:e2e:skip-snapshot XXX.e2e-test.ts # without snapshot
+   ```
+
+5. To Run **individual** test in a testing file, run:
+
+   ```bash
+     yarn components test:e2e:skip-snapshot -- './src/components/iconprovider/iconprovider.e2e-test.ts' -g 'mdc-IconmProvider nested'
+   ```
+
+    * where the test file is `"./src/components/iconprovider/iconprovider.e2e-test.ts"`, while within the file, the test naming structure is `mdc-IconmProvider nested`.
+
+6. To Run test in **specific** browser, run:
+
+   ```bash
+     yarn components test:e2e:chrome # run on chrome whithout snapshots
+     yarn components test:e2e:firefox # run on firefox whithout snapshots
+   ```
+
+### Update Visual Regression snapshots
+
+To update Visual Regression snapshots, follow the steps below to run E2E testing on Docker:
+
+1. You need to have docker installed on local.
+
+2. **Docker engine / daemon needs to run before executing.**
+
+3. Login to the docker ghrc.io:
 
-You can keep the first terminal open, while running/developing E2E tests in the second terminal.
+   ```bash
+    echo $PAT | docker login ghcr.io -u username --password-stdin # login to docker with you github credentials (replace $PAT with personal access token (access token needs write packages access))
+   ```
+
+4. Open a terminal to setup webserver:
+
+   ```bash
+     yarn components test:e2e:serve # setup server on localhost:4000
+   ```
+
+5. Open another terminal to run docker image:
+
+   ```bash
+     yarn components test:e2e:docker:serve # run docker image on localhost:3000
+   ```
+
+6. Open another terminal to start run the test:
+
+   ```bash
+     yarn components test:e2e:docker # run all the e2e test
+     yarn components test:e2e:docker:update-snapshot # update snapshots
+   ```
+
+7. To Run **single** E2E Test file, run:
+
+   ```bash
+     yarn components test:e2e:docker XXX.e2e-test.ts 
+     yarn components test:e2e:docker:update-snapshot XXX.e2e-test.ts # update snapshots
+   ```
+
+#### Testing method
+
+```bash
+  # E2E test methods
+  yarn components test:e2e:skip-snapshot # you should run this on local, test are filter test base on snapshot condition check
+  yarn components test:e2e # the general playwright script for local to run
+  yarn components test:e2e:install # install all the browsers dependencies to local
+  yarn components test:e2e:chrome # runs all test on specific browser, without snapshot
+  yarn components test:e2e:report # shows the previous test report (also work for docker test)
+
+  yarn components test:e2e:docker:build # build docker image that required for testing (can pull from GHCR)
+  yarn components test:e2e:docker:serve # run Playwright server in docker image to run the test
+  yarn components test:e2e:docker # the general playwright script for docker to run (Follow Docker Testing Instruction)
+  yarn components test:e2e:docker:update-snapshot # build and update snapshots (Only works if docker is installed)
+```
 
 #### Other ways of running tests
 
 * Using UI Mode - by running `yarn components test:e2e:ui` a separate browser window will be available, which allows you to control the running of tests from there
 * Using [Playwright VS Code extension](https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright)
+
+#### Note on Docker Perfomance on Mac (M Series)
+
+Since Docker runs on the `amd64` architecture, using Docker on Mac with M chips may result in slower performance due to the emulation layer provided by Rosetta 2. For faster performance, it's recommended to run Docker in a native `amd64` environment or be aware of the potential delays when running locally on Mac.
+
+### Upload Latest Version of Docker Playwright Image
+
+1. You need to have docker installed on local.
+
+2. Set the version to latest playwright version and build the new image to local :
+
+   ```bash
+     "yarn components test:e2e:docker:build": "docker build --platform linux/amd64 -f ./config/playwright/docker/utils/Dockerfile.test.postbuild -t ghcr.io/momentum-design/momentum-design/docker-playwright:v1.47.2 ."
+     # replace all the v1.47.2 to the latest version of playwright and run this script to build new image
+   ```
+
+3. After the build is done, login to the docker ghrc.io:
+
+   ```bash
+    echo $PAT | docker login ghcr.io -u username --password-stdin # login to docker with you github credentials (replace $PAT with personal access token (access token needs write packages access))
+   ```
+
+4. Now you can push the latest image to GHRC:
+
+   ```bash
+     docker push ghcr.io/momentum-design/momentum-design/docker-playwright:v1.47.2
+     # replace the v1.47.2 to the version you want to push
+   ```
+
+5. You can check the image that you push here [Docker-Playwright](https://github.com/orgs/momentum-design/packages/container/package/momentum-design%2Fdocker-playwright)
diff --git a/packages/components/config/playwright/docker/playwright.docker.config.ts b/packages/components/config/playwright/docker/playwright.docker.config.ts
new file mode 100644
index 000000000..1106d4018
--- /dev/null
+++ b/packages/components/config/playwright/docker/playwright.docker.config.ts
@@ -0,0 +1,133 @@
+import type { PlaywrightTestConfig } from '@playwright/test';
+import type { GitHubActionOptions } from '@estruyf/github-actions-reporter';
+import { devices } from '@playwright/test';
+import os from 'os';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+let url;
+if (os.platform() === 'linux') {
+  url = 'http://172.17.0.1:4000';
+} else {
+  url = 'http://host.docker.internal:4000';
+}
+
+const githubActionsReporterOptions: GitHubActionOptions = {
+  title: 'Playwright E2E Test results',
+  useDetails: true,
+  showAnnotations: true,
+  showTags: true,
+  showError: true,
+  includeResults: ['fail', 'flaky'],
+};
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+const config: PlaywrightTestConfig = {
+  testDir: '../../../src',
+  testMatch: /.*\.e2e-test\.ts/,
+  /* Maximum time one test can run for. */
+  timeout: 30 * 1000,
+  expect: {
+    /**
+     * Maximum time expect() should wait for the condition to be met.
+     * For example in `await expect(locator).toHaveText();`
+     */
+    timeout: 5000,
+  },
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? '50%' : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: process.env.CI ? [['html'], ['@estruyf/github-actions-reporter', githubActionsReporterOptions]] : 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
+    actionTimeout: 0,
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: url,
+    /* On CI: Collect trace when retrying the failed test /
+    Locally: always collect trace. See https://playwright.dev/docs/trace-viewer */
+    trace: process.env.CI ? 'retain-on-failure' : 'on',
+  },
+
+  snapshotPathTemplate: '{testDir}/{testFileDir}/__screenshots__/{projectName}/{arg}{ext}',
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chrome',
+      use: {
+        ...devices['Desktop Chrome'],
+        channel: 'chrome',
+      },
+    },
+    {
+      name: 'firefox',
+      use: {
+        ...devices['Desktop Firefox'],
+      },
+    },
+
+    {
+      name: 'webkit',
+      use: {
+        ...devices['Desktop Safari'],
+      },
+    },
+
+    /* Test against mobile viewports. */
+    // {
+    //   name: 'Mobile Chrome',
+    //   use: {
+    //     ...devices['Pixel 5'],
+    //   },
+    // },
+    // {
+    //   name: 'Mobile Safari',
+    //   use: {
+    //     ...devices['iPhone 12'],
+    //   },
+    // },
+
+    /* Test against branded browsers. */
+    {
+      name: 'msedge',
+      use: {
+        channel: 'msedge',
+      },
+    },
+  ],
+
+  /* Run your local dev server before starting the tests */
+  webServer: [
+    {
+      command: 'yarn test:e2e:setup',
+      url: 'http://localhost:4000',
+      stdout: 'pipe',
+      stderr: 'pipe',
+      timeout: 240 * 1000,
+      reuseExistingServer: !process.env.CI,
+    },
+    {
+      command: 'yarn test:e2e:docker:run',
+      url: 'http://localhost:3000',
+      stdout: 'pipe',
+      stderr: 'pipe',
+      timeout: 240 * 1000,
+      reuseExistingServer: !process.env.CI,
+    },
+  ],
+};
+
+export default config;
diff --git a/packages/components/config/playwright/docker/utils/Dockerfile.test.postbuild b/packages/components/config/playwright/docker/utils/Dockerfile.test.postbuild
new file mode 100644
index 000000000..b4f194e0c
--- /dev/null
+++ b/packages/components/config/playwright/docker/utils/Dockerfile.test.postbuild
@@ -0,0 +1,11 @@
+FROM mcr.microsoft.com/playwright:v1.47.2-focal
+
+RUN npm install -g playwright@1.47.2
+
+RUN npx playwright install
+
+RUN npx playwright install chrome
+
+RUN npx playwright install msedge
+
+CMD ["npx", "playwright", "run-server", "--port", "3000", "--host", "0.0.0.0"]
\ No newline at end of file
diff --git a/packages/components/config/playwright/setup/constants.ts b/packages/components/config/playwright/setup/constants.ts
index 02da942d3..61552f78f 100644
--- a/packages/components/config/playwright/setup/constants.ts
+++ b/packages/components/config/playwright/setup/constants.ts
@@ -28,8 +28,8 @@ const DEFAULT_ACCESSIBILITY_SCAN_OPTIONS = {
 // we keep the threshold, max_diff_pixels_ratio at a higher value until
 // we have pixel perfect visual regression testing enabled.
 const VISUAL_REGRESSION = {
-  THRESHOLD: 0.1,
-  MAX_DIFF_PIXELS_RATIO: 0.25,
+  THRESHOLD: 0,
+  MAX_DIFF_PIXELS_RATIO: 0,
   FILE_EXTENSION: 'png',
 };
 
diff --git a/packages/components/config/playwright/setup/utils/visual-regression.ts b/packages/components/config/playwright/setup/utils/visual-regression.ts
index 7b4ca1322..5e83a4dc0 100644
--- a/packages/components/config/playwright/setup/utils/visual-regression.ts
+++ b/packages/components/config/playwright/setup/utils/visual-regression.ts
@@ -23,12 +23,15 @@ class VisualRegression {
    */
   async takeScreenshot(name: string, options?: ScreenShotOptions): Promise<void> {
     const elementToTakeScreenShotFrom = options?.element || this.page;
+    const isSnapshotRun = process.env.E2E_SKIP_SNAPSHOT !== 'true';
 
-    expect(await elementToTakeScreenShotFrom.screenshot(options)).toMatchSnapshot({
-      name: `${name}.${CONSTANTS.VISUAL_REGRESSION.FILE_EXTENSION}`,
-      threshold: CONSTANTS.VISUAL_REGRESSION.THRESHOLD,
-      maxDiffPixelRatio: CONSTANTS.VISUAL_REGRESSION.MAX_DIFF_PIXELS_RATIO,
-    });
+    if (isSnapshotRun) {
+      expect(await elementToTakeScreenShotFrom.screenshot(options)).toMatchSnapshot({
+        name: `${name}.${CONSTANTS.VISUAL_REGRESSION.FILE_EXTENSION}`,
+        threshold: CONSTANTS.VISUAL_REGRESSION.THRESHOLD,
+        maxDiffPixelRatio: CONSTANTS.VISUAL_REGRESSION.MAX_DIFF_PIXELS_RATIO,
+      });
+    }
   }
 }
 
diff --git a/packages/components/package.json b/packages/components/package.json
index e742c34d5..e9e9ddd0f 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -62,16 +62,21 @@
     "publish:npmjs": "yarn publish:npmjs:prepare && yarn npm publish --access=public",
     "publish:npmjs:prepare": "node scripts/prepareForPublish.js",
     "test": "yarn test:prebuild && yarn test:postbuild",
-    "test:postbuild": "yarn test:e2e",
     "test:prebuild": "echo \"script 'test:prebuild' has not been implemented\"",
-    "test:e2e:install": "playwright install-deps && playwright install && yarn playwright install msedge",
+    "test:postbuild": "yarn test:e2e:docker",
+    "test:e2e:docker": "PW_TEST_CONNECT_WS_ENDPOINT=ws://localhost:3000/ playwright test --config './config/playwright/docker/playwright.docker.config.ts'",
+    "test:e2e:docker:build": "docker build --platform linux/amd64 -f ./config/playwright/docker/utils/Dockerfile.test.postbuild -t ghcr.io/momentum-design/momentum-design/docker-playwright:v1.47.2 .",
+    "test:e2e:docker:serve": "docker run --platform linux/amd64 -p 3000:3000 --rm --init --add-host=hostmachine:host-gateway ghcr.io/momentum-design/momentum-design/docker-playwright:v1.47.2",
+    "test:e2e:docker:update-snapshot": "yarn test:e2e:docker --update-snapshots",
     "test:e2e": "playwright test --config './config/playwright/playwright.config.ts'",
-    "test:e2e:chrome": "yarn test:e2e --project='chrome'",
-    "test:e2e:firefox": "yarn test:e2e --project='firefox'",
-    "test:e2e:webkit": "yarn test:e2e --project='webkit'",
-    "test:e2e:edge": "yarn test:e2e --project='msedge'",
+    "test:e2e:install": "playwright install-deps && playwright install && yarn playwright install msedge",
+    "test:e2e:skip-snapshot": "E2E_SKIP_SNAPSHOT=true playwright test --config './config/playwright/playwright.config.ts'",
+    "test:e2e:chrome": "yarn test:e2e:skip-snapshot --project='chrome'",
+    "test:e2e:firefox": "yarn test:e2e:skip-snapshot --project='firefox'",
+    "test:e2e:webkit": "yarn test:e2e:skip-snapshot --project='webkit'",
+    "test:e2e:edge": "yarn test:e2e:skip-snapshot --project='msedge'",
     "test:e2e:ui": "yarn test:e2e --ui",
-    "test:e2e:setup": "yarn clean:e2e && yarn copy:playwright && yarn build:browser:e2e",
+    "test:e2e:serve": "yarn clean:e2e && yarn copy:playwright && yarn build:browser:e2e",
     "test:e2e:report": "yarn playwright show-report"
   },
   "dependencies": {
diff --git a/packages/components/src/components/badge/__screenshots__/chrome/mdc-badge.png b/packages/components/src/components/badge/__screenshots__/chrome/mdc-badge.png
index 47a831a4c..f4a2170e6 100644
Binary files a/packages/components/src/components/badge/__screenshots__/chrome/mdc-badge.png and b/packages/components/src/components/badge/__screenshots__/chrome/mdc-badge.png differ
diff --git a/packages/components/src/components/badge/__screenshots__/msedge/mdc-badge.png b/packages/components/src/components/badge/__screenshots__/msedge/mdc-badge.png
index 47a831a4c..f4a2170e6 100644
Binary files a/packages/components/src/components/badge/__screenshots__/msedge/mdc-badge.png and b/packages/components/src/components/badge/__screenshots__/msedge/mdc-badge.png differ
diff --git a/packages/components/src/components/badge/__screenshots__/webkit/mdc-badge.png b/packages/components/src/components/badge/__screenshots__/webkit/mdc-badge.png
index 99d1f56e1..1c7563c85 100644
Binary files a/packages/components/src/components/badge/__screenshots__/webkit/mdc-badge.png and b/packages/components/src/components/badge/__screenshots__/webkit/mdc-badge.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-color.png b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-color.png
index c821dd4d5..9205eb165 100644
Binary files a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-color.png and b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-color.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-default.png b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-default.png
index fbd65dc0b..416e9e89b 100644
Binary files a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-default.png and b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-default.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-scale.png b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-scale.png
index fcca8341e..b593d6cf1 100644
Binary files a/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-scale.png and b/packages/components/src/components/icon/__screenshots__/chrome/mdc-icon-scale.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-color.png b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-color.png
index c821dd4d5..9205eb165 100644
Binary files a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-color.png and b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-color.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-default.png b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-default.png
index fbd65dc0b..416e9e89b 100644
Binary files a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-default.png and b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-default.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-scale.png b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-scale.png
index fcca8341e..b593d6cf1 100644
Binary files a/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-scale.png and b/packages/components/src/components/icon/__screenshots__/msedge/mdc-icon-scale.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-color.png b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-color.png
index 3d14b0a2f..14b264bd4 100644
Binary files a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-color.png and b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-color.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-default.png b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-default.png
index 1ac03eb0d..871579552 100644
Binary files a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-default.png and b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-default.png differ
diff --git a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-scale.png b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-scale.png
index db402ddc6..ce1da7507 100644
Binary files a/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-scale.png and b/packages/components/src/components/icon/__screenshots__/webkit/mdc-icon-scale.png differ
diff --git a/packages/components/src/components/icon/icon.e2e-test.ts b/packages/components/src/components/icon/icon.e2e-test.ts
index 63348683d..ef62c0b41 100644
--- a/packages/components/src/components/icon/icon.e2e-test.ts
+++ b/packages/components/src/components/icon/icon.e2e-test.ts
@@ -52,19 +52,17 @@ test('mdc-icon', async ({ componentsPage }) => {
   /**
    * VISUAL REGRESSION
    */
-
   await test.step('visual-regression', async () => {
     await test.step('matches screenshot of element with aria-label passed in', async () => {
       await componentsPage.visualRegression.takeScreenshot('mdc-icon-default', { element: iconWithAriaLabel });
     });
 
     await test.step('matches screenshot of element with size set to 2', async () => {
-      const iconScaled = await setup({
-        componentsPage,
-        name,
-        size: 2,
+      await componentsPage.setAttributes(iconWithAriaLabel, {
+        size: '2',
       });
-      await componentsPage.visualRegression.takeScreenshot('mdc-icon-scale', { element: iconScaled });
+
+      await componentsPage.visualRegression.takeScreenshot('mdc-icon-scale', { element: iconWithAriaLabel });
     });
 
     await test.step('matches screenshot of element with icon color set to red using css property', async () => {
diff --git a/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-nested.png b/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-nested.png
index b60660b9f..386351c87 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-nested.png and b/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-nested.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-standalone.png b/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-standalone.png
index a4ad939fc..ffa246967 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-standalone.png and b/packages/components/src/components/iconprovider/__screenshots__/chrome/mdc-iconprovider-standalone.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-nested.png b/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-nested.png
index b4232f7d3..3be372e8a 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-nested.png and b/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-nested.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-standalone.png b/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-standalone.png
index 0745dfc05..1589d54f8 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-standalone.png and b/packages/components/src/components/iconprovider/__screenshots__/firefox/mdc-iconprovider-standalone.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-nested.png b/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-nested.png
index b60660b9f..386351c87 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-nested.png and b/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-nested.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-standalone.png b/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-standalone.png
index a4ad939fc..ffa246967 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-standalone.png and b/packages/components/src/components/iconprovider/__screenshots__/msedge/mdc-iconprovider-standalone.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-nested.png b/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-nested.png
index a3e09c9b1..75c8236cb 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-nested.png and b/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-nested.png differ
diff --git a/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-standalone.png b/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-standalone.png
index 66378bb22..fdbd49918 100644
Binary files a/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-standalone.png and b/packages/components/src/components/iconprovider/__screenshots__/webkit/mdc-iconprovider-standalone.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-bold.png
index c8d1750e8..0babd6317 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium-underline.png
index 651a4ef2f..67bd3c1d7 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium.png
index 6cb150f47..45b19e5b3 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular-underline.png
index a0a4ab488..7fed37dae 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular.png
index 721369310..b18aaaf89 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-bold.png
index 742410424..7f6cee030 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium-underline.png
index e3317114a..f68a01189 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium.png
index b6a07de8d..887d07aaf 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular-underline.png
index 59c46bb57..8143b9bce 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-bold.png
index b3965ddfd..95384583f 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium-underline.png
index 9eee8e51f..b4783ec22 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium.png
index d62deee60..9003245bb 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular-underline.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular-underline.png
index e1d4d8330..b22f49c53 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular-underline.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular.png
index 8fd987b00..efa8e0382 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-body-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-bold.png
index d098f78bf..d8ceb8218 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-medium.png
index 312fc81b8..d06a3a359 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-regular.png
index 71af419b3..2de526865 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-bold.png
index 57942aa4c..66d5fc96a 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-medium.png
index cdc937ba6..355a61d6c 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-regular.png
index 9ff9c92e1..99bbe52a9 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-bold.png
index 08b9737cd..708461065 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-medium.png
index 25fe99d9e..88bd304b3 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-regular.png
index df5a2cce6..498bf8ab2 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-bold.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-bold.png
index 306364efa..2101319a3 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-bold.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-medium.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-medium.png
index f4145179c..c143b9269 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-medium.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-regular.png
index c83e7aeb7..e9ba18eb5 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-heading-xlarge-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-light.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-light.png
index adbc5c531..18b52957e 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-light.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-light.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-regular.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-regular.png
index 953a08614..da20eae84 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-regular.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-headline-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-div.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-div.png
index 967b96ddd..3714caea7 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-div.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-div.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h1.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h1.png
index 76f2e2ce4..034bccb6d 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h1.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h1.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h2.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h2.png
index 73fc43424..a5e7a0630 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h2.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h2.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h3.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h3.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h3.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h3.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h4.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h4.png
index db62b3ba6..4b5978187 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h4.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h4.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h5.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h5.png
index e5beba344..a94486a0e 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h5.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h5.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h6.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h6.png
index a7a017fd9..471da0007 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h6.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-h6.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-p.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-p.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-p.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-p.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-small.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-small.png
index 7142bccbd..4672052b9 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-small.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-small.png differ
diff --git a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-span.png b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-span.png
index 7142bccbd..4672052b9 100644
Binary files a/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-span.png and b/packages/components/src/components/text/__screenshots__/chrome/mdc-text-tag-span.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-bold.png
index 7719c467c..f5bc080c1 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium-underline.png
index e03126f67..a66637f26 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium.png
index 9f87ac765..5b88ebb9f 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular-underline.png
index d281d4874..9c40eae5f 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular.png
index d1a9378e5..94208bb17 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-bold.png
index ae4b74565..6b95e3da1 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium-underline.png
index 025ba8b8d..71fec6404 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium.png
index d7dbc12b8..330ff3178 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular-underline.png
index 68a2e380a..833fdc3bb 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular.png
index 618a200f3..0cc4fa74e 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-bold.png
index 3762da9f0..7710a6e34 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium-underline.png
index bcd821477..3a6267361 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium.png
index e9104996b..8deb5ed29 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular-underline.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular-underline.png
index e885d1929..69538e3f1 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular-underline.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular.png
index bf39dc851..fafab6e31 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-body-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-bold.png
index 3c51ee5c1..43693f65a 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-medium.png
index f56cb674a..dcce795ae 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-regular.png
index a744a0a76..135f64662 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-bold.png
index dbcae4b46..35c069de5 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-medium.png
index cec6feee7..d2e23ed90 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-regular.png
index 2858aa64b..6c357a17f 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-bold.png
index 106322e3b..13b1085f5 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-medium.png
index 506b1b476..7debab046 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-regular.png
index a56cda914..bb47f4e08 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-bold.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-bold.png
index 3ab01edce..6a0eee91d 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-bold.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-medium.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-medium.png
index 55731a7bd..7df3bc446 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-medium.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-regular.png
index 19ae4cb02..b7b478526 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-heading-xlarge-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-light.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-light.png
index 56a660e43..0b512d499 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-light.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-light.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-regular.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-regular.png
index 409251470..2294be848 100644
Binary files a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-regular.png and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-headline-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-div.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-div.png
new file mode 100644
index 000000000..0cc4fa74e
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-div.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h1.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h1.png
new file mode 100644
index 000000000..23b1f2eea
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h1.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h2.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h2.png
new file mode 100644
index 000000000..38f3bb5ae
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h2.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h3.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h3.png
new file mode 100644
index 000000000..0cc4fa74e
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h3.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h4.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h4.png
new file mode 100644
index 000000000..38f3bb5ae
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h4.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h5.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h5.png
new file mode 100644
index 000000000..23b1f2eea
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h5.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h6.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h6.png
new file mode 100644
index 000000000..38f3bb5ae
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-h6.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-p.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-p.png
new file mode 100644
index 000000000..0cc4fa74e
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-p.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-small.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-small.png
new file mode 100644
index 000000000..0cc4fa74e
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-small.png differ
diff --git a/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-span.png b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-span.png
new file mode 100644
index 000000000..0cc4fa74e
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/firefox/mdc-text-tag-span.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-bold.png
index c8d1750e8..0babd6317 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium-underline.png
index 651a4ef2f..67bd3c1d7 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium.png
index 6cb150f47..45b19e5b3 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular-underline.png
index a0a4ab488..7fed37dae 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular.png
index 721369310..b18aaaf89 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-bold.png
index 742410424..7f6cee030 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium-underline.png
index e3317114a..f68a01189 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium.png
index b6a07de8d..887d07aaf 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular-underline.png
index 59c46bb57..8143b9bce 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-bold.png
index b3965ddfd..95384583f 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium-underline.png
index 9eee8e51f..b4783ec22 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium.png
index d62deee60..9003245bb 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular-underline.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular-underline.png
index e1d4d8330..b22f49c53 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular-underline.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular.png
index 8fd987b00..efa8e0382 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-body-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-bold.png
index d098f78bf..d8ceb8218 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-medium.png
index 312fc81b8..d06a3a359 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-regular.png
index 71af419b3..2de526865 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-bold.png
index 57942aa4c..66d5fc96a 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-medium.png
index cdc937ba6..355a61d6c 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-regular.png
index 9ff9c92e1..99bbe52a9 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-bold.png
index 08b9737cd..708461065 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-medium.png
index 25fe99d9e..88bd304b3 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-regular.png
index df5a2cce6..498bf8ab2 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-bold.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-bold.png
index 306364efa..2101319a3 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-bold.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-medium.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-medium.png
index f4145179c..c143b9269 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-medium.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-regular.png
index c83e7aeb7..e9ba18eb5 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-heading-xlarge-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-light.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-light.png
index adbc5c531..18b52957e 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-light.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-light.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-regular.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-regular.png
index 953a08614..da20eae84 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-regular.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-headline-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-div.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-div.png
index 967b96ddd..3714caea7 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-div.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-div.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h1.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h1.png
index 76f2e2ce4..034bccb6d 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h1.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h1.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h2.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h2.png
index 73fc43424..a5e7a0630 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h2.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h2.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h3.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h3.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h3.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h3.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h4.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h4.png
index db62b3ba6..4b5978187 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h4.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h4.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h5.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h5.png
index e5beba344..a94486a0e 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h5.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h5.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h6.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h6.png
index a7a017fd9..471da0007 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h6.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-h6.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-p.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-p.png
index 7c1dd15d4..a65ff3249 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-p.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-p.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-small.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-small.png
index 7142bccbd..4672052b9 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-small.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-small.png differ
diff --git a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-span.png b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-span.png
index 7142bccbd..4672052b9 100644
Binary files a/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-span.png and b/packages/components/src/components/text/__screenshots__/msedge/mdc-text-tag-span.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-bold.png
index 680cc9784..40caf9e91 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium-underline.png
index 73b919ada..0cd430517 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium.png
index 94c4427c1..f86e75f13 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular-underline.png
index 3cbe494ca..233c7593e 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular.png
index 20eb920f7..49f61bbef 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-bold.png
index d854b5166..4a966287d 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium-underline.png
index c20fa95f0..ec4bf8c57 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium.png
index cb16ed20a..9201eec38 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular-underline.png
index 989ad1684..62f7d10f6 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular.png
index 81b17795f..42ef9c931 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-bold.png
index a406ba8fe..6ce5e8de7 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium-underline.png
index 7eb569fe2..96c3e5c0f 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium.png
index 9e867d7b4..2d9f172ed 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular-underline.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular-underline.png
index d956c3e83..e942903fb 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular-underline.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular-underline.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular.png
index ab78d2e3a..6c8892af5 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-body-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-bold.png
index 96d68c92f..aa0f1df51 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-medium.png
index d91f0b87b..50a184ca9 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-regular.png
index 4ca8c5312..67e0cf6b7 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-large-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-bold.png
index 155f40cc5..efef95530 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-medium.png
index 4e814decd..070a16643 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-regular.png
index 4dcc155d3..ae1c22f0e 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-midsize-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-bold.png
index 00a30e238..7d2523e92 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-medium.png
index 69fb2b468..cb09d17f1 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-regular.png
index 8000bc607..440407e75 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-bold.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-bold.png
index 7389d1ccf..480c194cb 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-bold.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-bold.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-medium.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-medium.png
index 613694ce7..73fb98a55 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-medium.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-medium.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-regular.png
index 372b4f3fd..9e30c8102 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-heading-xlarge-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-light.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-light.png
index 1e1fd12e5..97e5b3b0d 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-light.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-light.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-regular.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-regular.png
index 01364d236..35750dc3d 100644
Binary files a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-regular.png and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-headline-small-regular.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-div.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-div.png
new file mode 100644
index 000000000..42ef9c931
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-div.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h1.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h1.png
new file mode 100644
index 000000000..f67670c06
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h1.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h2.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h2.png
new file mode 100644
index 000000000..f67670c06
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h2.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h3.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h3.png
new file mode 100644
index 000000000..42ef9c931
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h3.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h4.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h4.png
new file mode 100644
index 000000000..f67670c06
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h4.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h5.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h5.png
new file mode 100644
index 000000000..f67670c06
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h5.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h6.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h6.png
new file mode 100644
index 000000000..f67670c06
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-h6.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-p.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-p.png
new file mode 100644
index 000000000..42ef9c931
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-p.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-small.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-small.png
new file mode 100644
index 000000000..42ef9c931
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-small.png differ
diff --git a/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-span.png b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-span.png
new file mode 100644
index 000000000..42ef9c931
Binary files /dev/null and b/packages/components/src/components/text/__screenshots__/webkit/mdc-text-tag-span.png differ
diff --git a/packages/components/src/components/text/text.e2e-test.ts b/packages/components/src/components/text/text.e2e-test.ts
index f881cb58d..d79069d90 100644
--- a/packages/components/src/components/text/text.e2e-test.ts
+++ b/packages/components/src/components/text/text.e2e-test.ts
@@ -9,7 +9,6 @@ type SetupOptions = {
   type: FontType;
   children: any;
   tagname?: ValidTextTags;
-  browserName: string;
 };
 
 const setup = async (args: SetupOptions) => {
@@ -41,7 +40,7 @@ test.describe('mdc-text', () => {
   });
   for (const textType of typesToTest) {
     test(textType, async ({ componentsPage }) => {
-      const text = await setup({ componentsPage, type: textType, children: textContent, browserName: 'chromium' });
+      const text = await setup({ componentsPage, type: textType, children: textContent });
 
       /**
        * ACCESSIBILITY
@@ -71,13 +70,12 @@ test.describe('mdc-text', () => {
   }
 
   for (const tagname of tagnameToTest) {
-    test(tagname, async ({ componentsPage, browserName }) => {
+    test(tagname, async ({ componentsPage }) => {
       const text = await setup({
         componentsPage,
         type: DEFAULTS.TYPE,
         tagname,
         children: textContent,
-        browserName,
       });
 
       /**
@@ -91,13 +89,11 @@ test.describe('mdc-text', () => {
        * VISUAL REGRESSION
        */
       // skipping visual regression for firefox and webkit due to flakiness
-      if (browserName === 'chromium') {
-        await test.step('visual-regression', async () => {
-          await test.step('matches screenshot of element', async () => {
-            await componentsPage.visualRegression.takeScreenshot(`mdc-text-tag-${tagname}`, { element: text });
-          });
+      await test.step('visual-regression', async () => {
+        await test.step('matches screenshot of element', async () => {
+          await componentsPage.visualRegression.takeScreenshot(`mdc-text-tag-${tagname}`, { element: text });
         });
-      }
+      });
 
       /**
        * ATTRIBUTES
diff --git a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png
index 76a9c8aae..cc0028d80 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png and b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-nested.png
index ed3c53527..a943fac3b 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-nested.png and b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-standalone.png
index cd7f704d4..b25d6fe56 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-standalone.png and b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-darkWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-nested.png
index dd04bd3e2..8d1c7759c 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-nested.png and b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-standalone.png
index 1ae573be7..b6de0d046 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-standalone.png and b/packages/components/src/components/themeprovider/__screenshots__/chrome/mdc-themeprovider-lightWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png
new file mode 100644
index 000000000..edf16471d
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-nested.png
new file mode 100644
index 000000000..021bd4f32
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-standalone.png
new file mode 100644
index 000000000..3a795925b
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-darkWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-nested.png
new file mode 100644
index 000000000..33b160055
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-standalone.png
new file mode 100644
index 000000000..4658b54a2
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/firefox/mdc-themeprovider-lightWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png
index 76a9c8aae..cc0028d80 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png and b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-nested.png
index ed3c53527..a943fac3b 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-nested.png and b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-standalone.png
index cd7f704d4..b25d6fe56 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-standalone.png and b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-darkWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-nested.png
index dd04bd3e2..8d1c7759c 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-nested.png and b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-standalone.png
index 1ae573be7..b6de0d046 100644
Binary files a/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-standalone.png and b/packages/components/src/components/themeprovider/__screenshots__/msedge/mdc-themeprovider-lightWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png
new file mode 100644
index 000000000..a497e4b14
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-a-other-theme-which-does-not-exist-error-case.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-nested.png
new file mode 100644
index 000000000..f9f1f2041
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-standalone.png
new file mode 100644
index 000000000..79f0b3130
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-darkWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-nested.png b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-nested.png
new file mode 100644
index 000000000..2e327c7ce
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-nested.png differ
diff --git a/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-standalone.png b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-standalone.png
new file mode 100644
index 000000000..7b44d549d
Binary files /dev/null and b/packages/components/src/components/themeprovider/__screenshots__/webkit/mdc-themeprovider-lightWebex-standalone.png differ
diff --git a/packages/components/src/components/themeprovider/themeprovider.e2e-test.ts b/packages/components/src/components/themeprovider/themeprovider.e2e-test.ts
index a412c849e..1bbc48fbb 100644
--- a/packages/components/src/components/themeprovider/themeprovider.e2e-test.ts
+++ b/packages/components/src/components/themeprovider/themeprovider.e2e-test.ts
@@ -8,7 +8,6 @@ type TestToRunArgs = {
   themeName: string;
   type: string;
   expectedNestedTheme: string;
-  browserName: string;
 };
 
 const testToRun = async ({
@@ -17,7 +16,6 @@ const testToRun = async ({
   themeName,
   type,
   expectedNestedTheme,
-  browserName,
 }: TestToRunArgs) => {
   const themeprovider = componentsPage.page.locator('mdc-themeprovider#local');
 
@@ -34,20 +32,17 @@ const testToRun = async ({
   /**
    * VISUAL REGRESSION
    */
-  // skipping visual regression for firefox and webkit due to flakiness
-  if (['chromium'].includes(browserName)) {
-    await test.step('visual-regression', async () => {
-      await test.step('matches screenshot of element', async () => {
-        let screenshotName = `mdc-themeprovider-${themeName}-${type}`;
+  await test.step('visual-regression', async () => {
+    await test.step('matches screenshot of element', async () => {
+      let screenshotName = `mdc-themeprovider-${themeName}-${type}`;
 
-        // if theme is undefined, we expect the default theme to be darkWebex
-        if (theme === undefined) {
-          screenshotName = 'mdc-themeprovider-darkWebex-standalone';
-        }
-        await componentsPage.visualRegression.takeScreenshot(screenshotName);
-      });
+      // if theme is undefined, we expect the default theme to be darkWebex
+      if (theme === undefined) {
+        screenshotName = 'mdc-themeprovider-darkWebex-standalone';
+      }
+      await componentsPage.visualRegression.takeScreenshot(screenshotName);
     });
-  }
+  });
 
   /**
    * ATTRIBUTES
@@ -144,14 +139,13 @@ test.describe.parallel('mdc-themeprovider', () => {
         }
       });
 
-      test(themeName, async ({ componentsPage, browserName }) => {
+      test(themeName, async ({ componentsPage }) => {
         await testToRun({
           componentsPage,
           theme,
           themeName,
           type,
           expectedNestedTheme: oppositeTheme,
-          browserName,
         });
       });
     });