diff --git a/ui/component/common/icon-custom.jsx b/ui/component/common/icon-custom.jsx
index fcd9e0954..a6122059b 100644
--- a/ui/component/common/icon-custom.jsx
+++ b/ui/component/common/icon-custom.jsx
@@ -201,6 +201,26 @@ export const icons = {
[ICONS.SUBSCRIBE]: buildIcon(
),
+ [ICONS.SUBSCRIBED]: (props: IconProps) => {
+ const { size = 24, color = 'currentColor', ...otherProps } = props;
+ return (
+
+ );
+ },
+
[ICONS.UNSUBSCRIBE]: buildIcon(
),
diff --git a/ui/component/subscribeButton/view.jsx b/ui/component/subscribeButton/view.jsx
index b39cc902b..82b898f73 100644
--- a/ui/component/subscribeButton/view.jsx
+++ b/ui/component/subscribeButton/view.jsx
@@ -89,7 +89,7 @@ export default function SubscribeButton(props: Props) {
ref={buttonRef}
iconColor="red"
largestLabel={isMobile && shrinkOnMobile ? '' : subscriptionLabel}
- icon={unfollowOverride ? ICONS.UNSUBSCRIBE : ICONS.SUBSCRIBE}
+ icon={unfollowOverride ? ICONS.UNSUBSCRIBE : isSubscribed ? ICONS.SUBSCRIBED : ICONS.SUBSCRIBE}
button={'alt'}
requiresAuth={IS_WEB}
label={label}
diff --git a/ui/constants/icons.js b/ui/constants/icons.js
index 6734cde59..e803a3dac 100644
--- a/ui/constants/icons.js
+++ b/ui/constants/icons.js
@@ -35,6 +35,7 @@ export const COMPLETE = 'Check';
export const COMPLETED = 'CheckCircle';
export const NOT_COMPLETED = 'Circle';
export const SUBSCRIBE = 'Heart';
+export const SUBSCRIBED = 'HeartSolid';
export const UNSUBSCRIBE = 'BrokenHeart';
export const BELL = 'Bell';
export const BELL_ON = 'BellOn';