diff --git a/.changeset/eight-aliens-warn.md b/.changeset/eight-aliens-warn.md
new file mode 100644
index 0000000000..f602b288d0
--- /dev/null
+++ b/.changeset/eight-aliens-warn.md
@@ -0,0 +1,7 @@
+---
+'@backstage/ui': patch
+---
+
+Fixed Table sorting indicator not being visible when a column is actively sorted.
+
+Affected components: Table, Column
diff --git a/packages/ui/src/components/Table/Table.module.css b/packages/ui/src/components/Table/Table.module.css
index ea148ae893..be35898fb0 100644
--- a/packages/ui/src/components/Table/Table.module.css
+++ b/packages/ui/src/components/Table/Table.module.css
@@ -39,12 +39,6 @@
     padding: var(--bui-space-3);
     font-size: var(--bui-font-size-3);
     color: var(--bui-fg-primary);
-
-    &:hover {
-      .bui-TableHeadSortButton {
-        opacity: 1;
-      }
-    }
   }
 
   .bui-TableHeadSelection {
@@ -68,17 +62,16 @@
     transition: opacity 0.1s ease-in-out;
     color: var(--bui-fg-secondary);
 
+    .bui-TableHead:hover &,
+    [data-sort-direction='ascending'] &,
+    [data-sort-direction='descending'] & {
+      opacity: 1;
+    }
+
     & svg {
       transition: transform 0.1s ease-in-out;
     }
-
-    &[data-sort-order='asc'] svg {
-      opacity: 1;
-      transform: rotate(0);
-    }
-
-    &[data-sort-order='desc'] svg {
-      opacity: 1;
+    [data-sort-direction='descending'] & svg {
       transform: rotate(180deg);
     }
   }
diff --git a/packages/ui/src/components/Table/components/Column.tsx b/packages/ui/src/components/Table/components/Column.tsx
index 9076ec8557..473f95a40e 100644
--- a/packages/ui/src/components/Table/components/Column.tsx
+++ b/packages/ui/src/components/Table/components/Column.tsx
@@ -20,7 +20,7 @@ import { TableDefinition } from '../definition';
 import styles from '../Table.module.css';
 import clsx from 'clsx';
 import { ColumnProps } from '../types';
-import { RiArrowUpLine, RiArrowDownLine } from '@remixicon/react';
+import { RiArrowUpLine } from '@remixicon/react';
 
 /** @public */
 export const Column = (props: ColumnProps) => {
@@ -32,7 +32,7 @@ export const Column = (props: ColumnProps) => {
       className={clsx(classNames.head, styles[classNames.head], className)}
       {...rest}
     >
-      {({ allowsSorting, sortDirection }) => (
+      {({ allowsSorting }) => (
         <div
           className={clsx(
             classNames.headContent,
@@ -48,11 +48,7 @@ export const Column = (props: ColumnProps) => {
                 styles[classNames.headSortButton],
               )}
             >
-              {sortDirection === 'descending' ? (
-                <RiArrowDownLine size={16} />
-              ) : (
-                <RiArrowUpLine size={16} />
-              )}
+              <RiArrowUpLine size={16} />
             </span>
           )}
         </div>