diff --git a/app/client/src/components/editorComponents/PremiumFeatureTag.tsx b/app/client/src/components/editorComponents/PremiumFeatureTag.tsx
new file mode 100644
index 000000000000..d4fefc572fcf
--- /dev/null
+++ b/app/client/src/components/editorComponents/PremiumFeatureTag.tsx
@@ -0,0 +1,14 @@
+import React from "react";
+import { Icon, Tag } from "@appsmith/ads";
+import { VisuallyHidden } from "@react-aria/visually-hidden";
+
+function PremiumFeatureTag() {
+  return (
+    <Tag isClosable={false} size="md">
+      <Icon name="star-line" size="sm" />
+      <VisuallyHidden>Premium feature</VisuallyHidden>
+    </Tag>
+  );
+}
+
+export default PremiumFeatureTag;
diff --git a/app/client/src/pages/Editor/IntegrationEditor/DatasourceItem.tsx b/app/client/src/pages/Editor/IntegrationEditor/DatasourceItem.tsx
index 698d6c7ce9c5..2c9c2092d1b2 100644
--- a/app/client/src/pages/Editor/IntegrationEditor/DatasourceItem.tsx
+++ b/app/client/src/pages/Editor/IntegrationEditor/DatasourceItem.tsx
@@ -5,6 +5,8 @@ import {
   DatasourceImage,
   DatasourceName,
   DatasourceNameWrapper,
+  DatasourceContentWrapper,
+  DatasourceLeftContent,
 } from "./IntegrationStyledComponents";
 
 interface DatasourceItem {
@@ -40,25 +42,29 @@ export default function DatasourceItem({
       data-testid={dataCardTestId}
       onClick={handleOnClick}
     >
-      <DatasourceImage
-        alt={name}
-        className="content-icon"
-        data-testid={dataCardImageTestId}
-        src={icon}
-      />
-      <DatasourceNameWrapper data-testid={dataCardWrapperTestId}>
-        <DatasourceName
-          className="t--plugin-name"
-          data-testid={dataNameTestId}
-          renderAs="p"
-        >
-          {name}
-        </DatasourceName>
-        <DatasourceDescription data-testid={dataCardDescriptionTestId}>
-          {description}
-        </DatasourceDescription>
-      </DatasourceNameWrapper>
-      {rightSibling}
+      <DatasourceContentWrapper>
+        <DatasourceLeftContent>
+          <DatasourceImage
+            alt={name}
+            className="content-icon"
+            data-testid={dataCardImageTestId}
+            src={icon}
+          />
+          <DatasourceNameWrapper data-testid={dataCardWrapperTestId}>
+            <DatasourceName
+              className="t--plugin-name"
+              data-testid={dataNameTestId}
+              renderAs="p"
+            >
+              {name}
+            </DatasourceName>
+            <DatasourceDescription data-testid={dataCardDescriptionTestId}>
+              {description}
+            </DatasourceDescription>
+          </DatasourceNameWrapper>
+        </DatasourceLeftContent>
+        {rightSibling}
+      </DatasourceContentWrapper>
     </DatasourceCard>
   );
 }
diff --git a/app/client/src/pages/Editor/IntegrationEditor/IntegrationStyledComponents.tsx b/app/client/src/pages/Editor/IntegrationEditor/IntegrationStyledComponents.tsx
index 1c23de9d1d34..3de8a296c05c 100644
--- a/app/client/src/pages/Editor/IntegrationEditor/IntegrationStyledComponents.tsx
+++ b/app/client/src/pages/Editor/IntegrationEditor/IntegrationStyledComponents.tsx
@@ -71,3 +71,18 @@ export const DatasourceDescription = styled.div`
   font-weight: var(--ads-v2-font-weight-normal);
   line-height: var(--ads-v2-line-height-2);
 `;
+
+export const DatasourceContentWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  gap: var(--ads-v2-spaces-4);
+`;
+
+export const DatasourceLeftContent = styled.div`
+  display: flex;
+  align-items: center;
+  gap: var(--ads-v2-spaces-4);
+  flex: 1;
+`;
diff --git a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx
index 087cbc38358b..e42960aea84c 100644
--- a/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx
+++ b/app/client/src/pages/Editor/IntegrationEditor/PremiumDatasources/index.tsx
@@ -1,30 +1,17 @@
 import React, { useState } from "react";
 import { getAssetUrl } from "ee/utils/airgapHelpers";
-import { Modal, ModalContent, Tag } from "@appsmith/ads";
+import { Modal, ModalContent } from "@appsmith/ads";
 import styled from "styled-components";
 import ContactForm from "./ContactForm";
 import { handlePremiumDatasourceClick } from "./Helpers";
 import DatasourceItem from "../DatasourceItem";
-import { createMessage } from "ee/constants/messages";
-import { PREMIUM_DATASOURCES } from "ee/constants/messages";
 import type { UpcomingIntegration } from "entities/Plugin";
+import PremiumFeatureTag from "components/editorComponents/PremiumFeatureTag";
 
 const ModalContentWrapper = styled(ModalContent)`
   max-width: 518px;
 `;
 
-const PremiumTag = styled(Tag)`
-  color: var(--ads-v2-color-purple-700);
-  background-color: var(--ads-v2-color-purple-100);
-  border-color: var(--ads-v2-color-purple-300);
-  padding: var(--ads-v2-spaces-3) var(--ads-v2-spaces-2);
-  text-transform: uppercase;
-  > span {
-    font-weight: 700;
-    font-size: 10px;
-  }
-`;
-
 export default function PremiumDatasources(props: {
   plugins: UpcomingIntegration[];
   isIntegrationsEnabledForPaid?: boolean;
@@ -53,11 +40,7 @@ export default function PremiumDatasources(props: {
           key={integration.name}
           name={integration.name}
           rightSibling={
-            !props.isIntegrationsEnabledForPaid && (
-              <PremiumTag isClosable={false} kind={"premium"}>
-                {createMessage(PREMIUM_DATASOURCES.PREMIUM_TAG)}
-              </PremiumTag>
-            )
+            !props.isIntegrationsEnabledForPaid && <PremiumFeatureTag />
           }
         />
       ))}