diff --git a/airflow/www/static/js/grid/dagRuns/Bar.jsx b/airflow/www/static/js/grid/dagRuns/Bar.jsx
index 7523b8dd2abee..22163a44da05e 100644
--- a/airflow/www/static/js/grid/dagRuns/Bar.jsx
+++ b/airflow/www/static/js/grid/dagRuns/Bar.jsx
@@ -30,6 +30,7 @@ import {
   useTheme,
 } from '@chakra-ui/react';
 import { MdPlayArrow } from 'react-icons/md';
+import { RiArrowGoBackFill } from 'react-icons/ri';
 
 import DagRunTooltip from './Tooltip';
 import { useContainerRef } from '../context/containerRef';
@@ -101,6 +102,7 @@ const DagRunBar = ({
             data-testid="run"
           >
             {run.runType === 'manual' && <MdPlayArrow size="8px" color="white" data-testid="manual-run" />}
+            {run.runType === 'backfill' && <RiArrowGoBackFill size="8px" color="white" data-testid="backfill-run" />}
           </Flex>
         </Tooltip>
       </Flex>
diff --git a/airflow/www/static/js/grid/dagRuns/Tooltip.jsx b/airflow/www/static/js/grid/dagRuns/Tooltip.jsx
index 82cec0d8c75ae..5f04f36d30bfb 100644
--- a/airflow/www/static/js/grid/dagRuns/Tooltip.jsx
+++ b/airflow/www/static/js/grid/dagRuns/Tooltip.jsx
@@ -25,7 +25,7 @@ import Time from '../components/Time';
 
 const DagRunTooltip = ({
   dagRun: {
-    state, duration, dataIntervalStart, executionDate,
+    state, duration, dataIntervalStart, executionDate, runType,
   },
 }) => (
   <Box py="2px">
@@ -44,6 +44,11 @@ const DagRunTooltip = ({
       {' '}
       {formatDuration(duration)}
     </Text>
+    <Text>
+      Type:
+      {' '}
+      {runType}
+    </Text>
   </Box>
 );
 
diff --git a/airflow/www/static/js/grid/details/Header.jsx b/airflow/www/static/js/grid/details/Header.jsx
index 92052d4c2ee94..c158deabcaa59 100644
--- a/airflow/www/static/js/grid/details/Header.jsx
+++ b/airflow/www/static/js/grid/details/Header.jsx
@@ -26,7 +26,8 @@ import {
   Heading,
   Text,
 } from '@chakra-ui/react';
-import { MdPlayArrow } from 'react-icons/md';
+import { MdPlayArrow, MdOutlineSchedule } from 'react-icons/md';
+import { RiArrowGoBackFill } from 'react-icons/ri';
 
 import { getMetaValue } from '../../utils';
 import useSelection from '../utils/useSelection';
@@ -71,6 +72,20 @@ const Header = () => {
           {runLabel}
         </>
       );
+    } else if (dagRun.runType === 'backfill') {
+      runLabel = (
+        <>
+          <RiArrowGoBackFill style={{ display: 'inline' }} />
+          {runLabel}
+        </>
+      );
+    } else if (dagRun.runType === 'scheduled') {
+      runLabel = (
+        <>
+          <MdOutlineSchedule style={{ display: 'inline' }} />
+          {runLabel}
+        </>
+      );
     }
   }
 
diff --git a/airflow/www/static/js/grid/details/content/dagRun/index.jsx b/airflow/www/static/js/grid/details/content/dagRun/index.jsx
index 61f66a7367a6f..27ee969aed4bd 100644
--- a/airflow/www/static/js/grid/details/content/dagRun/index.jsx
+++ b/airflow/www/static/js/grid/details/content/dagRun/index.jsx
@@ -25,7 +25,9 @@ import {
   Link,
   Divider,
 } from '@chakra-ui/react';
-import { MdPlayArrow, MdOutlineAccountTree } from 'react-icons/md';
+
+import { MdPlayArrow, MdOutlineSchedule, MdOutlineAccountTree } from 'react-icons/md';
+import { RiArrowGoBackFill } from 'react-icons/ri';
 
 import { SimpleStatus } from '../../../components/StatusBox';
 import { ClipboardText } from '../../../components/Clipboard';
@@ -97,6 +99,8 @@ const DagRun = ({ runId }) => {
         Run Type:
         {' '}
         {runType === 'manual' && <MdPlayArrow style={{ display: 'inline' }} />}
+        {runType === 'backfill' && <RiArrowGoBackFill style={{ display: 'inline' }} />}
+        {runType === 'scheduled' && <MdOutlineSchedule style={{ display: 'inline' }} />}
         {runType}
       </Text>
       <Text>