diff --git a/static/gsApp/components/powerFeatureHovercard.tsx b/static/gsApp/components/powerFeatureHovercard.tsx
index 954a8a05cc8afb..de712394299cc7 100644
--- a/static/gsApp/components/powerFeatureHovercard.tsx
+++ b/static/gsApp/components/powerFeatureHovercard.tsx
@@ -1,8 +1,10 @@
 import {Component} from 'react';
 import styled from '@emotion/styled';
 
-import {linkStyles} from 'sentry/components/core/link';
+import {Button} from 'sentry/components/core/button';
+import {Flex} from 'sentry/components/core/layout';
 import {Hovercard} from 'sentry/components/hovercard';
+import {IconLightning} from 'sentry/icons';
 import {t} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import type {Organization} from 'sentry/types/organization';
@@ -99,14 +101,22 @@ class PowerFeatureHovercard extends Component<Props> {
 
           return (
             <LearnMoreTextBody data-test-id="power-hovercard">
-              <div>
-                {partial
-                  ? t('Better With %s Plan', planName)
-                  : t('Requires %s Plan', planName)}
-              </div>
-              <LearnMoreLink onClick={this.handleClick} data-test-id="power-learn-more">
-                {t('Learn More')}
-              </LearnMoreLink>
+              <Flex direction="column" gap={space(1)}>
+                <div>
+                  {partial
+                    ? t('Better With %s Plan', planName)
+                    : t('Requires %s Plan', planName)}
+                </div>
+                <Button
+                  priority="primary"
+                  onClick={this.handleClick}
+                  data-test-id="power-learn-more"
+                  size="xs"
+                  icon={<IconLightning size="xs" />}
+                >
+                  {t('Learn More')}
+                </Button>
+              </Flex>
             </LearnMoreTextBody>
           );
         }}
@@ -128,21 +138,6 @@ class PowerFeatureHovercard extends Component<Props> {
   }
 }
 
-const LearnMoreLink = styled('button')`
-  ${p => linkStyles({theme: p.theme})}
-  background: none;
-  border: none;
-  padding: 0;
-
-  color: ${p => p.theme.subText};
-  text-decoration: underline;
-
-  &:hover {
-    color: ${p => p.theme.subText};
-    text-decoration: none;
-  }
-`;
-
 const LearnMoreTextBody = styled('div')`
   padding: ${space(1)};
 `;