diff --git a/apps/portal/postcss.config.cjs b/apps/portal/postcss.config.cjs
index c099299a..12a703d9 100644
--- a/apps/portal/postcss.config.cjs
+++ b/apps/portal/postcss.config.cjs
@@ -1,13 +1,6 @@
-// If you want to use other PostCSS plugins, see the following:
-// https://tailwindcss.com/docs/using-with-preprocessors
-
-const config = require('@tih/tailwind-config/tailwind.config.js');
-
 module.exports = {
   plugins: {
-    // Specifying the config is not necessary in most cases, but it is included
-    // here to share the same config across the entire monorepo
-    tailwindcss: { config },
+    tailwindcss: {},
     autoprefixer: {},
   },
 };
diff --git a/apps/portal/src/pages/_app.tsx b/apps/portal/src/pages/_app.tsx
index bd05dbec..5de4ac99 100644
--- a/apps/portal/src/pages/_app.tsx
+++ b/apps/portal/src/pages/_app.tsx
@@ -11,7 +11,6 @@ import AppShell from '~/components/global/AppShell';
 
 import type { AppRouter } from '~/server/router';
 
-import '@tih/ui/styles.css';
 import '~/styles/globals.css';
 
 const MyApp: AppType<{ session: Session | null }> = ({
diff --git a/apps/portal/src/pages/index.tsx b/apps/portal/src/pages/index.tsx
index 9d39e2db..2d3ab330 100644
--- a/apps/portal/src/pages/index.tsx
+++ b/apps/portal/src/pages/index.tsx
@@ -5,7 +5,7 @@ export default function HomePage() {
     <main className="flex-1 overflow-y-auto">
       <div className="flex h-full items-center justify-center">
         <div>
-          <h1 className="text-center text-4xl font-bold text-red-600">
+          <h1 className="text-primary-600 text-center text-4xl font-bold">
             Homepage
           </h1>
           <Button label="Button text" size="md" variant="primary" />
diff --git a/apps/portal/tailwind.config.cjs b/apps/portal/tailwind.config.cjs
new file mode 100644
index 00000000..fab7a40d
--- /dev/null
+++ b/apps/portal/tailwind.config.cjs
@@ -0,0 +1,9 @@
+const config = require('@tih/tailwind-config/tailwind.config.js');
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  ...config,
+  // Extract styles from ui package instead of importing the ui package's generated CSS
+  // file as the importing approach runs into style ordering issues.
+  content: [...config.content, './../../packages/ui/src/**/*.{ts,tsx}'],
+};