diff --git a/packages/components/src/components/tag/_tag.scss b/packages/components/src/components/tag/_tag.scss
index 6ab4b6385dfc..d229c776185d 100644
--- a/packages/components/src/components/tag/_tag.scss
+++ b/packages/components/src/components/tag/_tag.scss
@@ -17,6 +17,7 @@
 @mixin tags {
   .#{$prefix}--tag {
     @include type-style('label-01');
+    @include button-reset($width: false);
 
     display: inline-flex;
     align-items: center;
diff --git a/packages/react/src/components/Tag/Tag-story.js b/packages/react/src/components/Tag/Tag-story.js
index be94ef51a9f3..1b9ddcf8971a 100644
--- a/packages/react/src/components/Tag/Tag-story.js
+++ b/packages/react/src/components/Tag/Tag-story.js
@@ -26,7 +26,7 @@ const props = {
       'red'
     ),
     disabled: boolean('Disabled (disabled)', false),
-    title: 'Clear Selection',
+    title: 'Clear Filter',
   }),
   filter() {
     return { ...this.regular(), onClick: action('onClick') };
diff --git a/packages/react/src/components/Tag/Tag-test.js b/packages/react/src/components/Tag/Tag-test.js
index 537c3a6a10fb..bc899d9f194e 100644
--- a/packages/react/src/components/Tag/Tag-test.js
+++ b/packages/react/src/components/Tag/Tag-test.js
@@ -10,10 +10,43 @@ import Tag from '../Tag';
 import TagSkeleton from '../Tag/Tag.Skeleton';
 import { shallow } from 'enzyme';
 import { settings } from 'carbon-components';
+import { render, cleanup } from '@carbon/test-utils/react';
 
 const { prefix } = settings;
 
 describe('Tag', () => {
+  afterEach(cleanup);
+
+  describe('automated accessibility testing', () => {
+    it('should have no Axe violations', async () => {
+      const { container } = render(<Tag>This is not a tag</Tag>);
+      await expect(container).toHaveNoAxeViolations();
+    });
+
+    it('should have no DAP violations', async () => {
+      const { container } = render(
+        <main>
+          <Tag>This is not a tag</Tag>
+        </main>
+      );
+      await expect(container).toHaveNoDAPViolations('Tag');
+    });
+  });
+
+  describe('with a screenreader', () => {
+    it('filtered variant should have appropriate aria-label', () => {
+      const children = 'tag content';
+      const { container } = render(<Tag filter>{children}</Tag>);
+      const button = container.querySelector('[aria-label], [aria-labelledby]');
+      const accessibilityLabel =
+        button.getAttribute('aria-label') ||
+        button.getAttribute('aria-labelledby');
+      // This check would mirror our "Accessibility label must contain at least all of visible label"
+      // requirement
+      expect(accessibilityLabel).toEqual(expect.stringContaining(children));
+    });
+  });
+
   describe('Renders as expected', () => {
     it('should render with the appropriate type', () => {
       const tag = shallow(<Tag type="beta" />);
diff --git a/packages/react/src/components/Tag/Tag.js b/packages/react/src/components/Tag/Tag.js
index 2097b140b2b2..58f9f479b49c 100644
--- a/packages/react/src/components/Tag/Tag.js
+++ b/packages/react/src/components/Tag/Tag.js
@@ -41,19 +41,21 @@ const Tag = ({
     [`${prefix}--tag--filter`]: filter,
   });
   return filter ? (
-    <span
-      role="button"
+    <button
       className={tagClasses}
-      title={title || 'Clear filter'}
-      tabIndex="0" // eslint-disable-line jsx-a11y/no-noninteractive-tabindex
+      aria-label={
+        title !== undefined
+          ? `${title} ${children}`
+          : `Clear filter ${children}`
+      }
       {...other}>
       {children !== null && children !== undefined ? children : TYPES[type]}
-      <Close16 aria-label={title || 'Clear filter'} />
-    </span>
+      <Close16 />
+    </button>
   ) : (
-    <span className={tagClasses} {...other}>
+    <button className={tagClasses} {...other}>
       {children !== null && children !== undefined ? children : TYPES[type]}
-    </span>
+    </button>
   );
 };