1 files changed, 11 insertions, 20 deletions
diff --git a/src/screens/onboarding/WelcomeScreen.tsx b/src/screens/onboarding/WelcomeScreen.tsx
index 96d3f929..bfb1a127 100644
--- a/src/screens/onboarding/WelcomeScreen.tsx
+++ b/src/screens/onboarding/WelcomeScreen.tsx
@@ -1,10 +1,10 @@
+import {StackNavigationProp} from '@react-navigation/stack';
 import * as React from 'react';
-import {StyleSheet, View, Text, Image, TouchableOpacity} from 'react-native';
-import {SCREEN_WIDTH} from '../../utils';
-import {Background} from '../../components';
+import {Image, StyleSheet, Text, View} from 'react-native';
+import {Background, TaggSquareButton} from '../../components';
 import {OnboardingStackParams} from '../../routes';
-import {StackNavigationProp} from '@react-navigation/stack';
 import {BackgroundGradientType} from '../../types';
+import {SCREEN_WIDTH} from '../../utils';
 
 type WelcomeScreenNavigationProps = StackNavigationProp<
   OnboardingStackParams,
@@ -36,9 +36,13 @@ const WelcomeScreen: React.FC<WelcomeScreenProps> = ({navigation}) => {
           you are, along with all the moments that comprehensively define you!
         </Text>
       </View>
-      <TouchableOpacity onPress={handleNext} style={styles.nextButton}>
-        <Text style={styles.nextButtonLabel}>Next</Text>
-      </TouchableOpacity>
+      <TaggSquareButton
+        onPress={handleNext}
+        title={'Next'}
+        mode={'large'}
+        color={'purple'}
+        style={styles.nextButton}
+      />
     </Background>
   );
 };
@@ -75,20 +79,7 @@ const styles = StyleSheet.create({
     marginHorizontal: '10%',
   },
   nextButton: {
-    backgroundColor: '#8F01FF',
-    justifyContent: 'center',
-    alignItems: 'center',
-    width: '70%',
-    height: '10%',
-    borderRadius: 5,
-    borderWidth: 1,
-    borderColor: '#8F01FF',
     marginBottom: '15%',
   },
-  nextButtonLabel: {
-    fontSize: 30,
-    fontWeight: '500',
-    color: '#ddd',
-  },
 });
 export default WelcomeScreen;