diff --git a/apps/mobile/app.json b/apps/mobile/app.json
index 9f21512..71498ae 100644
--- a/apps/mobile/app.json
+++ b/apps/mobile/app.json
@@ -2,6 +2,7 @@
   "expo": {
     "name": "expo-monorepo",
     "slug": "expo-monorepo",
+    "scheme": "expo-monorepo",
     "version": "1.0.0",
     "orientation": "portrait",
     "icon": "./assets/icon.png",
diff --git a/apps/mobile/app/(tabs)/_layout.tsx b/apps/mobile/app/(tabs)/_layout.tsx
index 7f5c937..d3705ee 100644
--- a/apps/mobile/app/(tabs)/_layout.tsx
+++ b/apps/mobile/app/(tabs)/_layout.tsx
@@ -1,6 +1,6 @@
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 import { Link, Tabs } from 'expo-router';
-import { Pressable } from 'react-native';
+import { Pressable, useColorScheme } from 'react-native';
 
 // import Colors from "@/constants/Colors";
 
@@ -15,7 +15,7 @@ function TabBarIcon(props: {
 }
 
 export default function TabLayout() {
-  //const colorScheme = useColorScheme();
+  const colorScheme = useColorScheme();
 
   return (
     <Tabs
diff --git a/apps/mobile/app/(tabs)/index.tsx b/apps/mobile/app/(tabs)/index.tsx
index 4ea18c2..ad86aa0 100644
--- a/apps/mobile/app/(tabs)/index.tsx
+++ b/apps/mobile/app/(tabs)/index.tsx
@@ -1,20 +1,18 @@
 import { vars } from 'nativewind';
-import { Text, View } from 'react-native';
+import { Pressable, Text, View } from 'react-native';
 
 const theme = vars({
-  '--theme-fg': 'blue',
+  '--theme-fg': 'red',
 });
 
 const App = () => {
   return (
     <View className="flex-1 items-center justify-center" style={theme}>
-      <Text className="text-[16px] font-bold text-[--theme-fg] transition duration-[2s]">
-        Variables
-      </Text>
-      <Text className="text-base font-bold active:scale-150 active:text-[--theme-fg] transition duration-[500ms]">
+      <Text className="font-bold text-[--theme-fg]">Variables!</Text>
+      <Text className="font-bold active:scale-150 active:text-[--theme-fg] transition duration-[500ms]">
         Transitions
       </Text>
-      <Text className="text-[14px] font-bold animate-none active:animate-bounce">Animations</Text>
+      <Text className="font-bold animate-bounce placeholder:text-white">Animations</Text>
     </View>
   );
 };
diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index 80b210d..f25f920 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -2,6 +2,7 @@ import '../global.css';
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 import { useFonts } from 'expo-font';
 import { SplashScreen, Stack } from 'expo-router';
+import { vars } from 'nativewind';
 import { memo, useEffect } from 'react';
 import { View, StyleSheet } from 'react-native';
 
diff --git a/apps/mobile/package.json b/apps/mobile/package.json
index 9b629bd..028519b 100644
--- a/apps/mobile/package.json
+++ b/apps/mobile/package.json
@@ -11,7 +11,7 @@
     "ios": "expo start --ios",
     "web": "expo start --web",
     "eas-build-pre-install": "npm install --global pnpm@7.x",
-    "eas-build-post-install": "pnpm run -w build:mobile"
+    "eas-build-post-install": "tailwindcss -i ./global.css -o ./node_modules/.cache/nativewind/global.css.native.css"
   },
   "jest": {
     "preset": "jest-expo"
@@ -29,7 +29,7 @@
     "expo-status-bar": "~1.6.0",
     "expo-system-ui": "~2.4.0",
     "expo-web-browser": "~12.3.2",
-    "nativewind": "4.0.0-alpha.29",
+    "nativewind": "4.0.16",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-native": "0.72.6",
diff --git a/apps/mobile/tailwind.config.js b/apps/mobile/tailwind.config.js
index 1c2f464..8e8fc14 100644
--- a/apps/mobile/tailwind.config.js
+++ b/apps/mobile/tailwind.config.js
@@ -1,7 +1,7 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   darkMode: 'class',
-  content: ['app/**/*.{js,jsx,ts,tsx}'],
+  content: ['app/**/*.{js,jsx,ts,tsx}', '../../packages/ui/**/*.{js,jsx,ts,tsx}'],
   presets: [require('nativewind/preset')],
   plugins: [],
 };
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 51f5643..1ab0045 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -54,8 +54,8 @@ importers:
         specifier: ~12.3.2
         version: 12.3.2(expo@49.0.10)
       nativewind:
-        specifier: 4.0.0-alpha.29
-        version: 4.0.0-alpha.29(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3)
+        specifier: 4.0.16
+        version: 4.0.16(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native-safe-area-context@4.6.3)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3)
       react:
         specifier: 18.2.0
         version: 18.2.0
@@ -11711,23 +11711,21 @@ packages:
     hasBin: true
     dev: false
 
-  /nativewind@4.0.0-alpha.29(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3):
-    resolution: {integrity: sha512-HVfLpxOe8msQ2OQLm6TYUD/FRO5cdqbckNCfNe2/v4IVDAajI+zHeHfdpVeMX9Fr3YVDRdm/JHrD8hCIIU2dZQ==}
+  /nativewind@4.0.16(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native-safe-area-context@4.6.3)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3):
+    resolution: {integrity: sha512-QeRt4kmubo9XvxYb0vJh74h09fpwM0A4sN4bWo40DMxrrIEbqpgjHeow8pMN1wN8lH5PHttTHyJqDNS/dGoxYQ==}
     engines: {node: '>=16'}
     peerDependencies:
-      react-native-reanimated: '>=3.3.0'
       tailwindcss: '>3.3.0'
-    peerDependenciesMeta:
-      react-native-reanimated:
-        optional: true
     dependencies:
-      react-native-css-interop: 0.0.0-alpha.25(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3)
-      react-native-reanimated: 3.3.0(@babel/core@7.20.2)(react-native@0.72.6)(react@18.2.0)
+      react-native-css-interop: 0.0.16(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native-safe-area-context@4.6.3)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3)
       tailwindcss: 3.3.3
     transitivePeerDependencies:
       - '@babel/core'
       - react
       - react-native
+      - react-native-reanimated
+      - react-native-safe-area-context
+      - react-native-svg
       - supports-color
     dev: false
 
@@ -12725,16 +12723,20 @@ packages:
   /react-is@18.2.0:
     resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==}
 
-  /react-native-css-interop@0.0.0-alpha.25(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3):
-    resolution: {integrity: sha512-2Dlj2EgjB06xA9llJ/HypTgJn8flCKYT2vnbkG0p9xNTJMfNLLGNmzOQxOVS97FGqqtzRuceFRAKMmk0SAf57w==}
+  /react-native-css-interop@0.0.16(@babel/core@7.20.2)(react-native-reanimated@3.3.0)(react-native-safe-area-context@4.6.3)(react-native@0.72.6)(react@18.2.0)(tailwindcss@3.3.3):
+    resolution: {integrity: sha512-BSejbQyWfvEqaEqNzq7JGITLvoOgZVnRa0Vn1NqQcWm9OPfNE/OTk6k1AatIQ8SHHg0fRJ9v8+OGJYBR0j01PQ==}
     engines: {node: '>=16'}
     peerDependencies:
       react: '>=18'
       react-native: '*'
       react-native-reanimated: '>=3.3.0'
+      react-native-safe-area-context: '>=4'
+      react-native-svg: '*'
       tailwindcss: ~3
     peerDependenciesMeta:
-      react-native-reanimated:
+      react-native-safe-area-context:
+        optional: true
+      react-native-svg:
         optional: true
     dependencies:
       '@babel/helper-module-imports': 7.22.15
@@ -12745,6 +12747,7 @@ packages:
       react: 18.2.0
       react-native: 0.72.6(@babel/core@7.20.2)(react@18.2.0)
       react-native-reanimated: 3.3.0(@babel/core@7.20.2)(react-native@0.72.6)(react@18.2.0)
+      react-native-safe-area-context: 4.6.3(react-native@0.72.6)(react@18.2.0)
       tailwindcss: 3.3.3
     transitivePeerDependencies:
       - '@babel/core'