diff --git a/plugins/api-docs/src/components/ApisCards/ProvidedApisCard.tsx b/plugins/api-docs/src/components/ApisCards/ProvidedApisCard.tsx
index a80706d8e0..c6cca7a35f 100644
--- a/plugins/api-docs/src/components/ApisCards/ProvidedApisCard.tsx
+++ b/plugins/api-docs/src/components/ApisCards/ProvidedApisCard.tsx
@@ -26,6 +26,7 @@ import {
   Progress,
   WarningPanel,
 } from '@backstage/core';
+import { Typography } from '@material-ui/core';
 import {
   EntityTable,
   useEntity,
@@ -71,11 +72,15 @@ export const ProvidedApisCard = ({ variant = 'gridItem' }: Props) => {
       title="Provided APIs"
       variant={variant}
       emptyContent={
-        <div>
-          This {entity.kind.toLowerCase()} does not provide its own APIs.{' '}
-          <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#specprovidesapis-optional">
-            (Learn how to change this.)
-          </Link>
+        <div style={{ textAlign: 'center' }}>
+          <Typography variant="h6">
+            This {entity.kind.toLowerCase()} does not provide its own APIs.{' '}
+          </Typography>
+          <Typography variant="body2">
+            <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#specprovidesapis-optional">
+              Learn how to change this.
+            </Link>
+          </Typography>
         </div>
       }
       columns={apiEntityColumns}
diff --git a/plugins/api-docs/src/components/ComponentsCards/ProvidingComponentsCard.tsx b/plugins/api-docs/src/components/ComponentsCards/ProvidingComponentsCard.tsx
index ed4ecec619..5d5158d9ae 100644
--- a/plugins/api-docs/src/components/ComponentsCards/ProvidingComponentsCard.tsx
+++ b/plugins/api-docs/src/components/ComponentsCards/ProvidingComponentsCard.tsx
@@ -72,7 +72,7 @@ export const ProvidingComponentsCard = ({ variant = 'gridItem' }: Props) => {
       variant={variant}
       emptyContent={
         <div style={{ textAlign: 'center' }}>
-          <Typography variant="h6">No component provides this API. </Typography>
+          <Typography variant="h6">No component provides this API.</Typography>
           <Typography variant="body2">
             <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#specprovidesapis-optional">
               Learn how to change this.
diff --git a/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx b/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
index 53d42c1d82..e993aa1a91 100644
--- a/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
+++ b/plugins/catalog/src/components/HasComponentsCard/HasComponentsCard.tsx
@@ -22,6 +22,7 @@ import {
   Progress,
   WarningPanel,
 } from '@backstage/core';
+import { Typography } from '@material-ui/core';
 import {
   EntityTable,
   useEntity,
@@ -73,11 +74,15 @@ export const HasComponentsCard = ({ variant = 'gridItem' }: Props) => {
       title="Components"
       variant={variant}
       emptyContent={
-        <div>
-          No component is part of this system.{' '}
-          <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#kind-component">
-            (Learn how to add components.)
-          </Link>
+        <div style={{ textAlign: 'center' }}>
+          <Typography variant="h6">
+            No component is part of this system.
+          </Typography>
+          <Typography variant="body2">
+            <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#kind-component">
+              Learn how to change this.
+            </Link>
+          </Typography>
         </div>
       }
       columns={columns}
diff --git a/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx b/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
index 5dd261ce3f..bcde4c576b 100644
--- a/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
+++ b/plugins/catalog/src/components/HasSubcomponentsCard/HasSubcomponentsCard.tsx
@@ -22,6 +22,7 @@ import {
   Progress,
   WarningPanel,
 } from '@backstage/core';
+import { Typography } from '@material-ui/core';
 import {
   EntityTable,
   useEntity,
@@ -73,11 +74,15 @@ export const HasSubcomponentsCard = ({ variant = 'gridItem' }: Props) => {
       title="Subcomponents"
       variant={variant}
       emptyContent={
-        <div>
-          No subcomponent is part of this component.{' '}
-          <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#specsubcomponentof-optional">
-            (Learn how to add subcomponents.)
-          </Link>
+        <div style={{ textAlign: 'center' }}>
+          <Typography variant="h6">
+            No subcomponent is part of this component.
+          </Typography>
+          <Typography variant="body2">
+            <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#specsubcomponentof-optional">
+              Learn how to change this.
+            </Link>
+          </Typography>
         </div>
       }
       columns={columns}
diff --git a/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx b/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
index 0ceab31a4d..0146bfc165 100644
--- a/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
+++ b/plugins/catalog/src/components/HasSystemsCard/HasSystemsCard.tsx
@@ -22,6 +22,7 @@ import {
   Progress,
   WarningPanel,
 } from '@backstage/core';
+import { Typography } from '@material-ui/core';
 import {
   EntityTable,
   useEntity,
@@ -70,11 +71,15 @@ export const HasSystemsCard = ({ variant = 'gridItem' }: Props) => {
       title="Systems"
       variant={variant}
       emptyContent={
-        <div>
-          No system is part of this domain.{' '}
-          <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#kind-system">
-            (Learn how to add systems.)
-          </Link>
+        <div style={{ textAlign: 'center' }}>
+          <Typography variant="h6">
+            No system is part of this domain.
+          </Typography>
+          <Typography variant="body2">
+            <Link to="https://backstage.io/docs/features/software-catalog/descriptor-format#kind-system">
+              Learn how to change this.
+            </Link>
+          </Typography>
         </div>
       }
       columns={columns}