diff --git a/platform/ui/src/components/StudyListTable/StudyListTableRow.js b/platform/ui/src/components/StudyListTable/StudyListTableRow.js
index f466d4e8b..d7205fbb9 100644
--- a/platform/ui/src/components/StudyListTable/StudyListTableRow.js
+++ b/platform/ui/src/components/StudyListTable/StudyListTableRow.js
@@ -10,23 +10,23 @@ const StudyListTableRow = (props) => {
       <tr>
         <td
           className={classnames('border-0 p-0', {
-            'border-b border-custom-violetPale bg-custom-navyDark': isExpanded,
+            'border-b border-secondary-light bg-primary-dark': isExpanded,
           })}
         >
           <div
             className={classnames('w-full transition duration-300', {
-              'border border-custom-aquaBright rounded overflow-hidden mb-2 hover:border-custom-violetPale': isExpanded,
+              'border border-primary-light rounded overflow-hidden mb-2 hover:border-secondary-light': isExpanded,
             })}
           >
             <table className={classnames('w-full p-4')}>
               <tbody>
                 <tr
                   className={classnames(
-                    'cursor-pointer hover:bg-custom-violetDark transition duration-300 bg-black',
+                    'cursor-pointer hover:bg-secondary-main transition duration-300 bg-black',
                     {
-                      'bg-custom-navyDark': !isExpanded,
+                      'bg-primary-dark': !isExpanded,
                     },
-                    { 'bg-custom-navy': isExpanded }
+                    { 'bg-secondary-dark': isExpanded }
                   )}
                   onClick={onClickRow}
                 >
@@ -38,7 +38,7 @@ const StudyListTableRow = (props) => {
                         key={name}
                         className={classnames(
                           'px-4 py-2 text-base',
-                          { 'border-b border-custom-violetPale': !isExpanded },
+                          { 'border-b border-secondary-light': !isExpanded },
                           `w-${gridCol}/24` || ''
                         )}
                       >
diff --git a/platform/ui/src/views/StudyList/StudyList.js b/platform/ui/src/views/StudyList/StudyList.js
index b5bca9430..d66d2bb30 100644
--- a/platform/ui/src/views/StudyList/StudyList.js
+++ b/platform/ui/src/views/StudyList/StudyList.js
@@ -192,8 +192,8 @@ const StudyList = () => {
               <Icon
                 name="series-active"
                 className={classnames('inline-flex mr-2', {
-                  'text-custom-blueBright': isExpanded,
-                  'text-custom-violetPale': !isExpanded,
+                  'text-primary-active': isExpanded,
+                  'text-secondary-light': !isExpanded,
                 })}
               />
               {Instances}
@@ -231,7 +231,7 @@ const StudyList = () => {
           >
             Module 3
           </Button>
-          <div className="ml-5 text-lg text-custom-grayBright inline-flex items-center">
+          <div className="ml-5 text-lg text-common-bright inline-flex items-center">
             <Icon name="notificationwarning-diamond" className="mr-2 w-5 h-5" />
             Feedback text lorem ipsum dolor sit amet
           </div>
diff --git a/platform/ui/src/views/StudyList/StudyList.mdx b/platform/ui/src/views/StudyList/StudyList.mdx
index 40435bf14..52aa4c905 100644
--- a/platform/ui/src/views/StudyList/StudyList.mdx
+++ b/platform/ui/src/views/StudyList/StudyList.mdx
@@ -120,7 +120,7 @@ import { StudyList } from '@ohif/ui';
       },
     ];
     const isFiltering = (filterValues, defaultFilterValues) => {
-      return Object.keys(defaultFilterValues).some(name => {
+      return Object.keys(defaultFilterValues).some((name) => {
         return filterValues[name] !== defaultFilterValues[name];
       });
     };
@@ -206,8 +206,8 @@ import { StudyList } from '@ohif/ui';
                 <Icon
                   name="series-active"
                   className={classnames('inline-flex mr-2', {
-                    'text-custom-blueBright': isExpanded,
-                    'text-custom-violetPale': !isExpanded,
+                    'text-primary-active': isExpanded,
+                    'text-secondary-light': !isExpanded,
                   })}
                 />
                 {Instances}
@@ -249,7 +249,7 @@ import { StudyList } from '@ohif/ui';
             >
               Module 3
             </Button>
-            <div className="ml-5 text-lg text-custom-grayBright inline-flex items-center">
+            <div className="ml-5 text-lg text-common-bright inline-flex items-center">
               <Icon
                 name="notificationwarning-diamond"
                 className="mr-2 w-5 h-5"
@@ -312,13 +312,13 @@ import { StudyList } from '@ohif/ui';
               </div>
             </div>
             <div className="flex items-center">
-              <span className="mr-3 text-custom-grayLight text-lg">
+              <span className="mr-3 text-common-light text-lg">
                 FOR INVESTIGATIONAL USE ONLY
               </span>
               <IconButton
                 variant="text"
                 color="inherit"
-                className="text-custom-blueBright"
+                className="text-primary-active"
                 onClick={() => {}}
               >
                 <React.Fragment>