diff --git a/app.config.ts b/app.config.ts
index d693de68..ffb94fc0 100644
--- a/app.config.ts
+++ b/app.config.ts
@@ -29,6 +29,7 @@ const config: ExpoConfig = {
     imagesUrl: process.env.DUO_IMAGES_URL,
     audioUrl: process.env.DUO_AUDIO_URL,
     statusUrl: process.env.DUO_STATUS_URL,
+    webUrl: process.env.DUO_WEB_BASE_URL,
   },
   web: {
     favicon: "./assets/favicon.png"
diff --git a/components/traits-tab.tsx b/components/traits-tab.tsx
index 294a639f..64341f56 100644
--- a/components/traits-tab.tsx
+++ b/components/traits-tab.tsx
@@ -23,6 +23,7 @@ import { DuoliciousTopNavBar } from './top-nav-bar';
 import { referrerId } from '../App';
 import { api } from '../api/api';
 import { useFocusEffect } from '@react-navigation/native';
+import { WEB_BASE_URL } from '../env/env';
 
 const sideMargins: StyleProp<ViewStyle> = {
   marginLeft: 10,
@@ -32,12 +33,12 @@ const sideMargins: StyleProp<ViewStyle> = {
 const ShareNotice = ({personId}) => {
   const [isCopied, setIsCopied] = useState(false);
 
-  const url = `https://web.duolicious.app/me/${personId}`;
+  const url = `${WEB_BASE_URL}/me/${personId}`;
 
   const onPressNotice = useCallback(async () => {
     await Clipboard.setStringAsync(url);
     setIsCopied(true);
-  }, []);
+  }, [url]);
 
   return (
     <Pressable
diff --git a/env/env.tsx b/env/env.tsx
index 628ba8b4..40e60d1d 100644
--- a/env/env.tsx
+++ b/env/env.tsx
@@ -5,3 +5,4 @@ export const CHAT_URL = Constants.expoConfig?.extra?.chatUrl ?? 'ws://localhost:
 export const IMAGES_URL = Constants.expoConfig?.extra?.imagesUrl ?? 'http://localhost:9090/s3-mock-bucket';
 export const AUDIO_URL = Constants.expoConfig?.extra?.audioUrl ?? 'http://localhost:9090/s3-mock-audio-bucket';
 export const STATUS_URL = Constants.expoConfig?.extra?.statusUrl ?? 'http://localhost:8080';
+export const WEB_BASE_URL = Constants.expoConfig?.extra?.webUrl ?? 'https://web.duolicious.app';