diff --git a/plugins/github-release-manager/src/cards/createRc/CreateRc.test.tsx b/plugins/github-release-manager/src/cards/createRc/CreateRc.test.tsx
index f9d6c9a248..42942d8a38 100644
--- a/plugins/github-release-manager/src/cards/createRc/CreateRc.test.tsx
+++ b/plugins/github-release-manager/src/cards/createRc/CreateRc.test.tsx
@@ -21,7 +21,7 @@ import {
   mockApiClient,
   mockCalverProject,
   mockNextGitHubInfo,
-  mockReleaseCandidate,
+  mockReleaseCandidateCalver,
   mockReleaseBranch,
   mockReleaseVersionCalver,
   mockSemverProject,
@@ -46,7 +46,7 @@ describe('CreateRc', () => {
     const { getByTestId } = render(
       <CreateRc
         defaultBranch="mockDefaultBranch"
-        latestRelease={mockReleaseCandidate}
+        latestRelease={mockReleaseCandidateCalver}
         releaseBranch={mockReleaseBranch}
       />,
     );
diff --git a/plugins/github-release-manager/src/cards/createRc/CreateRc.tsx b/plugins/github-release-manager/src/cards/createRc/CreateRc.tsx
index a71359af06..3787e1b253 100644
--- a/plugins/github-release-manager/src/cards/createRc/CreateRc.tsx
+++ b/plugins/github-release-manager/src/cards/createRc/CreateRc.tsx
@@ -121,7 +121,7 @@ export const CreateRc = ({
         <Typography>
           <Differ
             icon="branch"
-            prev={releaseBranch?.name}
+            current={releaseBranch?.name}
             next={nextGitHubInfo.rcBranch}
           />
         </Typography>
@@ -129,7 +129,7 @@ export const CreateRc = ({
         <Typography>
           <Differ
             icon="tag"
-            prev={latestRelease?.tagName}
+            current={latestRelease?.tagName}
             next={nextGitHubInfo.rcReleaseTag}
           />
         </Typography>
diff --git a/plugins/github-release-manager/src/cards/patchRc/PatchBody.test.tsx b/plugins/github-release-manager/src/cards/patchRc/PatchBody.test.tsx
index 8562635f82..7cae67d126 100644
--- a/plugins/github-release-manager/src/cards/patchRc/PatchBody.test.tsx
+++ b/plugins/github-release-manager/src/cards/patchRc/PatchBody.test.tsx
@@ -21,7 +21,7 @@ import {
   mockApiClient,
   mockBumpedTag,
   mockCalverProject,
-  mockReleaseCandidate,
+  mockReleaseCandidateCalver,
   mockReleaseBranch,
   mockReleaseVersionCalver,
   mockTagParts,
@@ -48,7 +48,7 @@ describe('PatchBody', () => {
     const { getByTestId } = render(
       <PatchBody
         bumpedTag={mockBumpedTag}
-        latestRelease={mockReleaseCandidate}
+        latestRelease={mockReleaseCandidateCalver}
         releaseBranch={mockReleaseBranch}
         tagParts={mockTagParts}
       />,
diff --git a/plugins/github-release-manager/src/cards/patchRc/PatchBody.tsx b/plugins/github-release-manager/src/cards/patchRc/PatchBody.tsx
index d12d150980..f6f16f0199 100644
--- a/plugins/github-release-manager/src/cards/patchRc/PatchBody.tsx
+++ b/plugins/github-release-manager/src/cards/patchRc/PatchBody.tsx
@@ -142,7 +142,7 @@ export const PatchBody = ({
         )}
 
         <Typography className={classes.paragraph}>
-          <Differ icon="tag" prev={latestRelease.tagName} next={bumpedTag} />
+          <Differ icon="tag" current={latestRelease.tagName} next={bumpedTag} />
         </Typography>
       </>
     );
diff --git a/plugins/github-release-manager/src/cards/promoteRc/PromoteRc.test.tsx b/plugins/github-release-manager/src/cards/promoteRc/PromoteRc.test.tsx
index 92c67734dd..f4e7c1fb41 100644
--- a/plugins/github-release-manager/src/cards/promoteRc/PromoteRc.test.tsx
+++ b/plugins/github-release-manager/src/cards/promoteRc/PromoteRc.test.tsx
@@ -18,7 +18,7 @@ import React from 'react';
 import { render } from '@testing-library/react';
 
 import {
-  mockReleaseCandidate,
+  mockReleaseCandidateCalver,
   mockReleaseVersionCalver,
 } from '../../test-helpers/test-helpers';
 import { TEST_IDS } from '../../test-helpers/test-ids';
@@ -50,7 +50,7 @@ describe('PromoteRc', () => {
 
   it('should display PromoteRcBody', () => {
     const { getByTestId } = render(
-      <PromoteRc latestRelease={mockReleaseCandidate} />,
+      <PromoteRc latestRelease={mockReleaseCandidateCalver} />,
     );
 
     expect(
diff --git a/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.test.tsx b/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.test.tsx
index 94595ae11a..f917f67e2b 100644
--- a/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.test.tsx
+++ b/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.test.tsx
@@ -20,7 +20,7 @@ import { render } from '@testing-library/react';
 import {
   mockApiClient,
   mockCalverProject,
-  mockReleaseCandidate,
+  mockReleaseCandidateCalver,
 } from '../../test-helpers/test-helpers';
 import { TEST_IDS } from '../../test-helpers/test-ids';
 
@@ -36,7 +36,7 @@ import { PromoteRcBody } from './PromoteRcBody';
 describe('PromoteRcBody', () => {
   it('should display CTA', () => {
     const { getByTestId } = render(
-      <PromoteRcBody rcRelease={mockReleaseCandidate} />,
+      <PromoteRcBody rcRelease={mockReleaseCandidateCalver} />,
     );
 
     expect(getByTestId(TEST_IDS.promoteRc.cta)).toBeInTheDocument();
diff --git a/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.tsx b/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.tsx
index 9c49b19196..ffea5659a1 100644
--- a/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.tsx
+++ b/plugins/github-release-manager/src/cards/promoteRc/PromoteRcBody.tsx
@@ -63,7 +63,11 @@ export const PromoteRcBody = ({ rcRelease, successCb }: PromoteRcBodyProps) => {
         </Typography>
 
         <Typography className={classes.paragraph}>
-          <Differ icon="tag" prev={rcRelease.tagName} next={releaseVersion} />
+          <Differ
+            icon="tag"
+            current={rcRelease.tagName}
+            next={releaseVersion}
+          />
         </Typography>
       </>
     );
diff --git a/plugins/github-release-manager/src/cards/promoteRc/sideEffects/promoteRc.test.ts b/plugins/github-release-manager/src/cards/promoteRc/sideEffects/promoteRc.test.ts
index 4c7836707f..109f886e5b 100644
--- a/plugins/github-release-manager/src/cards/promoteRc/sideEffects/promoteRc.test.ts
+++ b/plugins/github-release-manager/src/cards/promoteRc/sideEffects/promoteRc.test.ts
@@ -16,7 +16,7 @@
 
 import {
   mockApiClient,
-  mockReleaseCandidate,
+  mockReleaseCandidateCalver,
   mockSemverProject,
 } from '../../../test-helpers/test-helpers';
 import { promoteRc } from './promoteRc';
@@ -27,7 +27,7 @@ describe('promoteRc', () => {
   it('should work', async () => {
     const result = await promoteRc({
       pluginApiClient: mockApiClient,
-      rcRelease: mockReleaseCandidate,
+      rcRelease: mockReleaseCandidateCalver,
       releaseVersion: 'version-1.2.3',
       project: mockSemverProject,
     })();
diff --git a/plugins/github-release-manager/src/components/Differ.test.tsx b/plugins/github-release-manager/src/components/Differ.test.tsx
new file mode 100644
index 0000000000..cb625c4118
--- /dev/null
+++ b/plugins/github-release-manager/src/components/Differ.test.tsx
@@ -0,0 +1,72 @@
+/*
+ * Copyright 2021 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+
+import { Differ } from './Differ';
+import { TEST_IDS } from '../test-helpers/test-ids';
+import {
+  mockReleaseCandidateCalver,
+  mockReleaseVersionCalver,
+  mockReleaseVersionSemver,
+} from '../test-helpers/test-helpers';
+
+describe('Differ', () => {
+  it('should render icon and `none` for missing current & next', () => {
+    const { getByTestId, queryByTestId } = render(<Differ icon="branch" />);
+
+    const icon = getByTestId(TEST_IDS.components.differ.icons.branch);
+    const current = getByTestId(TEST_IDS.components.differ.current);
+    const next = queryByTestId(TEST_IDS.components.differ.next);
+
+    expect(icon).toBeInTheDocument();
+    expect(current.innerHTML).toMatchInlineSnapshot(`"None"`);
+    expect(next).not.toBeInTheDocument();
+  });
+
+  it('should render icon & current for missing next', () => {
+    const { getByTestId, queryByTestId } = render(
+      <Differ icon="branch" current={mockReleaseVersionSemver.tagName} />,
+    );
+
+    const icon = getByTestId(TEST_IDS.components.differ.icons.branch);
+    const current = getByTestId(TEST_IDS.components.differ.current);
+    const next = queryByTestId(TEST_IDS.components.differ.next);
+
+    expect(icon).toBeInTheDocument();
+    expect(current.innerHTML).toMatchInlineSnapshot(`"version-1.2.3"`);
+    expect(next).not.toBeInTheDocument();
+  });
+
+  it('should render icon & current & next (with seperator)', () => {
+    const { getByTestId, queryByTestId } = render(
+      <Differ
+        icon="branch"
+        current={mockReleaseCandidateCalver.tagName}
+        next={mockReleaseVersionCalver.tagName}
+      />,
+    );
+
+    const icon = getByTestId(TEST_IDS.components.differ.icons.branch);
+    const current = getByTestId(TEST_IDS.components.differ.current);
+    const next = queryByTestId(TEST_IDS.components.differ.next);
+
+    expect(icon).toBeInTheDocument();
+    expect(current.innerHTML).toMatchInlineSnapshot(`"rc-2020.01.01_1"`);
+    expect(next?.innerHTML).toMatchInlineSnapshot(`"version-2020.01.01_1"`);
+  });
+});
diff --git a/plugins/github-release-manager/src/components/Differ.tsx b/plugins/github-release-manager/src/components/Differ.tsx
index 05241e43df..047b1fbd7e 100644
--- a/plugins/github-release-manager/src/components/Differ.tsx
+++ b/plugins/github-release-manager/src/components/Differ.tsx
@@ -22,44 +22,16 @@ import DynamicFeedIcon from '@material-ui/icons/DynamicFeed';
 import GitHubIcon from '@material-ui/icons/GitHub';
 import LocalOfferIcon from '@material-ui/icons/LocalOffer';
 
+import { GitHubReleaseManagerError } from '../errors/GitHubReleaseManagerError';
+import { TEST_IDS } from '../test-helpers/test-ids';
+
 interface DifferProps {
+  icon: 'tag' | 'branch' | 'github' | 'slack' | 'versioning';
+  current?: string;
   next?: string | ReactNode;
-  prev?: string;
-  prefix?: string;
-  icon?: 'tag' | 'branch' | 'github' | 'slack' | 'versioning';
 }
 
-const Icon = ({ icon }: { icon: DifferProps['icon'] }) => {
-  switch (icon) {
-    case 'tag':
-      return (
-        <LocalOfferIcon style={{ verticalAlign: 'middle' }} fontSize="small" />
-      );
-
-    case 'branch':
-      return (
-        <CallSplitIcon style={{ verticalAlign: 'middle' }} fontSize="small" />
-      );
-
-    case 'github':
-      return (
-        <GitHubIcon style={{ verticalAlign: 'middle' }} fontSize="small" />
-      );
-
-    case 'slack':
-      return <ChatIcon style={{ verticalAlign: 'middle' }} fontSize="small" />;
-
-    case 'versioning':
-      return (
-        <DynamicFeedIcon style={{ verticalAlign: 'middle' }} fontSize="small" />
-      );
-
-    default:
-      return null;
-  }
-};
-
-export const Differ = ({ prev, next, prefix, icon }: DifferProps) => {
+export const Differ = ({ current, next, icon }: DifferProps) => {
   return (
     <>
       {icon && (
@@ -67,14 +39,79 @@ export const Differ = ({ prev, next, prefix, icon }: DifferProps) => {
           <Icon icon={icon} />{' '}
         </span>
       )}
-      {prefix && <span>{prefix}: </span>}
-      {prev && (
-        <>
-          <span style={{ color: grey[700] }}>{prev}</span>
-          <span>{'  →  '}</span>
-        </>
+
+      <span
+        data-testid={TEST_IDS.components.differ.current}
+        style={{ color: grey[700] }}
+      >
+        {current ?? 'None'}
+      </span>
+
+      {next && <span>{'  →  '}</span>}
+      {next && (
+        <span
+          data-testid={TEST_IDS.components.differ.next}
+          style={{ fontWeight: 'bold' }}
+        >
+          {next}
+        </span>
       )}
-      <b>{next ?? 'None'}</b>
     </>
   );
 };
+
+interface IconProps {
+  icon: DifferProps['icon'];
+}
+
+function Icon({ icon }: IconProps) {
+  switch (icon) {
+    case 'tag':
+      return (
+        <LocalOfferIcon
+          data-testid={TEST_IDS.components.differ.icons.tag}
+          style={{ verticalAlign: 'middle' }}
+          fontSize="small"
+        />
+      );
+
+    case 'branch':
+      return (
+        <CallSplitIcon
+          data-testid={TEST_IDS.components.differ.icons.branch}
+          style={{ verticalAlign: 'middle' }}
+          fontSize="small"
+        />
+      );
+
+    case 'github':
+      return (
+        <GitHubIcon
+          data-testid={TEST_IDS.components.differ.icons.github}
+          style={{ verticalAlign: 'middle' }}
+          fontSize="small"
+        />
+      );
+
+    case 'slack':
+      return (
+        <ChatIcon
+          data-testid={TEST_IDS.components.differ.icons.slack}
+          style={{ verticalAlign: 'middle' }}
+          fontSize="small"
+        />
+      );
+
+    case 'versioning':
+      return (
+        <DynamicFeedIcon
+          data-testid={TEST_IDS.components.differ.icons.versioning}
+          style={{ verticalAlign: 'middle' }}
+          fontSize="small"
+        />
+      );
+
+    default:
+      throw new GitHubReleaseManagerError('Invalid Differ icon');
+  }
+}
diff --git a/plugins/github-release-manager/src/test-helpers/test-helpers.ts b/plugins/github-release-manager/src/test-helpers/test-helpers.ts
index 35d1a32520..f3a2403d19 100644
--- a/plugins/github-release-manager/src/test-helpers/test-helpers.ts
+++ b/plugins/github-release-manager/src/test-helpers/test-helpers.ts
@@ -72,7 +72,7 @@ const createMockRelease = ({
   targetCommitish: 'rc/1.2.3',
   ...rest,
 });
-export const mockReleaseCandidate = createMockRelease({
+export const mockReleaseCandidateCalver = createMockRelease({
   prerelease: true,
   tagName: 'rc-2020.01.01_1',
   targetCommitish: 'rc/1.2.3',
diff --git a/plugins/github-release-manager/src/test-helpers/test-ids.ts b/plugins/github-release-manager/src/test-helpers/test-ids.ts
index f096af567f..106747e428 100644
--- a/plugins/github-release-manager/src/test-helpers/test-ids.ts
+++ b/plugins/github-release-manager/src/test-helpers/test-ids.ts
@@ -51,5 +51,16 @@ export const TEST_IDS = {
       'grm--response-step-list-item--item-icon--link',
     responseStepListItemIconDefault:
       'grm--response-step-list-item--item-icon--default',
+    differ: {
+      current: 'grm--differ-current',
+      next: 'grm--differ-next',
+      icons: {
+        tag: 'grm--differ--icons--tag',
+        branch: 'grm--differ--icons--branch',
+        github: 'grm--differ--icons--github',
+        slack: 'grm--differ--icons--slack',
+        versioning: 'grm--differ--icons--versioning',
+      },
+    },
   },
 };