diff --git a/app/views/projects/compare/show.html.haml b/app/views/projects/compare/show.html.haml
index 69c7a497c7d5d10975d2b2f05c9453bd834c988b..088b4857fb85bceb5deb7f9697c48642bbe5194a 100644
--- a/app/views/projects/compare/show.html.haml
+++ b/app/views/projects/compare/show.html.haml
@@ -18,16 +18,17 @@
     paginate_diffs: true,
     paginate_diffs_per_page: Projects::CompareController::COMMIT_DIFFS_PER_PAGE
 - else
-  = render Pajamas::CardComponent.new(card_options: { class: "gl-bg-gray-50 gl-mb-5 gl-border-none gl-text-center" }) do |c|
+  = render Pajamas::CardComponent.new(card_options: { class: "gl-bg-gray-10" }) do |c|
     - c.with_body do
-      %h4
-        = s_("CompareRevisions|There isn't anything to compare.")
-      %p.gl-mb-4.gl-line-height-24
-        - if params[:to] == params[:from]
-          - source_branch = capture do
-            %span.ref-name= params[:from]
-          - target_branch = capture do
-            %span.ref-name= params[:to]
-          = (s_("CompareRevisions|%{source_branch} and %{target_branch} are the same.") % { source_branch: source_branch, target_branch: target_branch }).html_safe
-        - else
-          = _("You'll need to use different branch names to get a valid comparison.")
+      = render Pajamas::EmptyStateComponent.new(svg_path: 'illustrations/empty-state/empty-commit-md.svg',
+        title: s_("CompareRevisions|There isn't anything to compare")) do |c|
+
+        - c.with_description do
+          - if params[:to] == params[:from]
+            - source_branch = capture do
+              %span.ref-name= params[:from]
+            - target_branch = capture do
+              %span.ref-name= params[:to]
+            = (s_("CompareRevisions|%{source_branch} and %{target_branch} are the same.") % { source_branch: source_branch, target_branch: target_branch }).html_safe
+          - else
+            = _("To get a valid comparison, select two different branches.")
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 9dd0463c0b240db22b08f376f6a763d6756b3ecb..ece7a0acf815fef433f10a93ded44f1b46072272 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -12658,7 +12658,7 @@ msgstr ""
 msgid "CompareRevisions|Tags"
 msgstr ""
 
-msgid "CompareRevisions|There isn't anything to compare."
+msgid "CompareRevisions|There isn't anything to compare"
 msgstr ""
 
 msgid "CompareRevisions|There was an error while loading the branch/tag list. Please try again."
@@ -52196,6 +52196,9 @@ msgstr ""
 msgid "To further protect your account, consider configuring a two-factor authentication method: %{mfa_link}."
 msgstr ""
 
+msgid "To get a valid comparison, select two different branches."
+msgstr ""
+
 msgid "To get started you enter your FogBugz URL and login information below. In the next steps, you'll be able to map users and select the projects you want to import."
 msgstr ""
 
@@ -58015,9 +58018,6 @@ msgstr ""
 msgid "You'll be charged for %{true_up_start}users over license%{true_up_end} on a quarterly or annual basis, depending on the terms of your agreement."
 msgstr ""
 
-msgid "You'll need to use different branch names to get a valid comparison."
-msgstr ""
-
 msgid "You're about to leave GitLab"
 msgstr ""