diff --git a/packages/storybook/stories/additional-docs.js b/packages/storybook/stories/additional-docs.js
index ec83589a78..4da059fc00 100644
--- a/packages/storybook/stories/additional-docs.js
+++ b/packages/storybook/stories/additional-docs.js
@@ -53,7 +53,7 @@ export const additionalDocs = {
   'Tag': {
     guidanceHref: 'tag',
     guidanceName: 'Tag',
-    maturityCategory: USE,
-    maturityLevel: DEPLOYED,
+    maturityCategory: DONT_USE,
+    maturityLevel: DEPRECATED,
   },
 };
diff --git a/packages/storybook/stories/tag.mdx b/packages/storybook/stories/tag.mdx
index 3ed6ae863a..60e3dc32d0 100644
--- a/packages/storybook/stories/tag.mdx
+++ b/packages/storybook/stories/tag.mdx
@@ -18,4 +18,4 @@ import * as TagStories from './tag.stories';
 
 <Canvas>
   <Story of={TagStories.Default} />
-</Canvas>
+</Canvas>
\ No newline at end of file
diff --git a/packages/storybook/stories/tag.stories.js b/packages/storybook/stories/tag.stories.js
index 6eeb2f6cc4..30b6ccba30 100644
--- a/packages/storybook/stories/tag.stories.js
+++ b/packages/storybook/stories/tag.stories.js
@@ -1,9 +1,12 @@
 export default {
-  title: 'Components/Tag',
+  title: 'Deprecated/Tag',
   id: 'components/tag',
+  parameters: {
+    chromatic: { disableSnapshot: true },
+  },
 };
 
 export const Default = {
   render: () => <span className="usa-label">New</span>,
   name: 'Default',
-};
+};
\ No newline at end of file
diff --git a/packages/storybook/stories/va-tag.stories.tsx b/packages/storybook/stories/va-tag.stories.tsx
new file mode 100644
index 0000000000..3d1f04f3e3
--- /dev/null
+++ b/packages/storybook/stories/va-tag.stories.tsx
@@ -0,0 +1,36 @@
+import { getWebComponentDocs, propStructure, StoryDocs } from './wc-helpers';
+
+const tagDocs = getWebComponentDocs('va-tag');
+
+export default {
+  title: 'Components/Tag',
+  id: 'components/va-tag',
+  component: 'va-tag',
+  decorators: [
+    (Story) => (
+      <div className="vads-u-margin--1">
+        <Story />
+      </div>
+    ),
+  ],
+  parameters: {
+    componentSubtitle: 'va-tag web component',
+    docs: {
+      page: () => <StoryDocs storyDefault={Default} data={tagDocs} />,
+    },
+  },
+  argTypes: {
+    ...propStructure(tagDocs),
+  }
+};
+
+const Template = (args) => {
+  return (
+    <va-tag text={args.text}></va-tag>
+  );
+};
+
+export const Default = Template.bind({});
+Default.args = {
+  text: 'New',
+};
diff --git a/packages/web-components/src/components.d.ts b/packages/web-components/src/components.d.ts
index 8b89068a94..c47b462d01 100644
--- a/packages/web-components/src/components.d.ts
+++ b/packages/web-components/src/components.d.ts
@@ -2004,6 +2004,17 @@ export namespace Components {
          */
         "label": string;
     }
+    /**
+     * @componentName Tag
+     * @maturityCategory caution
+     * @maturityLevel candidate
+     */
+    interface VaTag {
+        /**
+          * The text to be displayed in the tag element.
+         */
+        "text": string;
+    }
     /**
      * @componentName Telephone
      * @maturityCategory use
@@ -3679,6 +3690,17 @@ declare global {
         prototype: HTMLVaTabsElement;
         new (): HTMLVaTabsElement;
     };
+    /**
+     * @componentName Tag
+     * @maturityCategory caution
+     * @maturityLevel candidate
+     */
+    interface HTMLVaTagElement extends Components.VaTag, HTMLStencilElement {
+    }
+    var HTMLVaTagElement: {
+        prototype: HTMLVaTagElement;
+        new (): HTMLVaTagElement;
+    };
     interface HTMLVaTelephoneElementEventMap {
         "component-library-analytics": any;
     }
@@ -3843,6 +3865,7 @@ declare global {
         "va-table-inner": HTMLVaTableInnerElement;
         "va-table-row": HTMLVaTableRowElement;
         "va-tabs": HTMLVaTabsElement;
+        "va-tag": HTMLVaTagElement;
         "va-telephone": HTMLVaTelephoneElement;
         "va-telephone-input": HTMLVaTelephoneInputElement;
         "va-text-input": HTMLVaTextInputElement;
@@ -6136,6 +6159,17 @@ declare namespace LocalJSX {
          */
         "label"?: string;
     }
+    /**
+     * @componentName Tag
+     * @maturityCategory caution
+     * @maturityLevel candidate
+     */
+    interface VaTag {
+        /**
+          * The text to be displayed in the tag element.
+         */
+        "text": string;
+    }
     /**
      * @componentName Telephone
      * @maturityCategory use
@@ -6529,6 +6563,7 @@ declare namespace LocalJSX {
         "va-table-inner": VaTableInner;
         "va-table-row": VaTableRow;
         "va-tabs": VaTabs;
+        "va-tag": VaTag;
         "va-telephone": VaTelephone;
         "va-telephone-input": VaTelephoneInput;
         "va-text-input": VaTextInput;
@@ -6917,6 +6952,12 @@ declare module "@stencil/core" {
              * @maturityLevel candidate
              */
             "va-tabs": LocalJSX.VaTabs & JSXBase.HTMLAttributes<HTMLVaTabsElement>;
+            /**
+             * @componentName Tag
+             * @maturityCategory caution
+             * @maturityLevel candidate
+             */
+            "va-tag": LocalJSX.VaTag & JSXBase.HTMLAttributes<HTMLVaTagElement>;
             /**
              * @componentName Telephone
              * @maturityCategory use
diff --git a/packages/web-components/src/components/va-tag/test/va-tag.e2e.ts b/packages/web-components/src/components/va-tag/test/va-tag.e2e.ts
new file mode 100644
index 0000000000..c85cf25e3b
--- /dev/null
+++ b/packages/web-components/src/components/va-tag/test/va-tag.e2e.ts
@@ -0,0 +1,27 @@
+import { newE2EPage } from '@stencil/core/testing';
+import { axeCheck } from '../../../testing/test-helpers';
+
+describe('va-tag', () => {
+  it('renders', async () => {
+    const page = await newE2EPage();
+    await page.setContent('<va-tag text="Test tag"></va-tag>');
+
+    const element = await page.find('va-tag');
+    expect(element).toHaveClass('hydrated');
+  });
+
+  it('passes accessibility tests', async () => {
+    const page = await newE2EPage();
+    await page.setContent('<va-tag></va-tag>');
+
+    await axeCheck(page);
+  });
+
+  it('respect the text prop', async () => {
+    const page = await newE2EPage();
+    await page.setContent('<va-tag text="Test tag"></va-tag>');
+
+    const element = await page.find('va-tag');
+    expect(element.shadowRoot.querySelector('span').innerHTML).toBe('Test tag');
+  });
+});
diff --git a/packages/web-components/src/components/va-tag/va-tag.scss b/packages/web-components/src/components/va-tag/va-tag.scss
new file mode 100644
index 0000000000..f4c0a699a5
--- /dev/null
+++ b/packages/web-components/src/components/va-tag/va-tag.scss
@@ -0,0 +1,3 @@
+@forward 'settings';
+
+@use 'usa-tag/src/styles/usa-tag';
diff --git a/packages/web-components/src/components/va-tag/va-tag.tsx b/packages/web-components/src/components/va-tag/va-tag.tsx
new file mode 100644
index 0000000000..16a8d00a13
--- /dev/null
+++ b/packages/web-components/src/components/va-tag/va-tag.tsx
@@ -0,0 +1,36 @@
+import {
+  Component,
+  Element,
+  Host,
+  Prop,
+  h,
+} from '@stencil/core';
+
+/**
+ * @componentName Tag
+ * @maturityCategory caution
+ * @maturityLevel candidate
+ */
+@Component({
+  tag: 'va-tag',
+  styleUrl: 'va-tag.scss',
+  shadow: true,
+})
+export class VaTag {
+  @Element() el: HTMLElement;
+
+  /**
+   * The text to be displayed in the tag element.
+   */
+  @Prop() text!: string;
+
+  render() {
+    const { text } = this;
+
+    return (
+      <Host>
+        <span class="usa-tag">{text}</span>
+      </Host>
+    );
+  }
+}