diff --git a/apps/example/app/(tabs)/index.tsx b/apps/example/app/(tabs)/index.tsx
index 25be9212..a9267557 100644
--- a/apps/example/app/(tabs)/index.tsx
+++ b/apps/example/app/(tabs)/index.tsx
@@ -1,6 +1,7 @@
 import { HomeMessage, HomeMessageIcon } from '@acme/feature-home';
 import { Image, StyleSheet, Platform } from 'react-native';
 
+import HelloWeb from '@/components/HelloWeb';
 import ParallaxScrollView from '@/components/ParallaxScrollView';
 import { ThemedText } from '@/components/ThemedText';
 import { ThemedView } from '@/components/ThemedView';
@@ -16,6 +17,9 @@ export default function HomeScreen() {
         />
       }
     >
+      <ThemedView style={styles.titleContainer}>
+        <HelloWeb name="Tyler" />
+      </ThemedView>
       <ThemedView style={styles.titleContainer}>
         <ThemedText>
           <HomeMessage />
diff --git a/apps/example/components/HelloWeb.tsx b/apps/example/components/HelloWeb.tsx
new file mode 100644
index 00000000..0429b5da
--- /dev/null
+++ b/apps/example/components/HelloWeb.tsx
@@ -0,0 +1,14 @@
+'use dom';
+
+import { DOMProps } from 'expo/dom';
+
+export default function HelloWeb(props: DOMProps & { name: string }) {
+  console.log('hello from web component');
+  console.log('props:', props);
+
+  return (
+    <div style={{ backgroundColor: 'green', flex: 1 }}>
+      <p style={{ color: 'white' }}>Hello {props.name}, from a web view</p>
+    </div>
+  );
+}