Change a vector icon colour when pressed, React Native

Question

I have started to learn React Native recently, to try and build an application. I am trying to change the colour of the social media icons when the user clicks on them. I have manged to direct to a link when pressed but failed to change the colour.

Index.js

const SocialMedia = () => {
    
    return (
        <View style={styles.container}>
            <Pressable 
        onPress={() =>{ Linking.openURL('https://www.facebook.com/frogsystems')
            ;
        }}>
            <Icon style={styles.social} name="facebook-f" size={30} color="#900" />
            </Pressable>

            <Pressable 
        onPress={() =>{ Linking.openURL('https://www.linkedin.com/company/frog-systems-ltd/')
            ;
        }}>
            <Icon style={styles.social} name="linkedin" size={30} color="#900" />
            </Pressable>

            <Pressable 
        onPress={() =>{ Linking.openURL('https://twitter.com/frogsystemsltd')
            ;
        }}>
            <Icon style={styles.social} name="twitter" size={30} color="#900" />
            </Pressable>

    
        </View>
    )
}

export default SocialMedia;

styles.js

import { StyleSheet } from "react-native";

const styles = StyleSheet.create({


    container: {
        flexDirection: 'row',
        padding: 50,
        justifyContent: 'center',
        alignItems: "center",
        
        
        
        

        

    },

    social:{
        color:'white',
        padding:20,
        alignItems: 'center',
        
    },


});

export default styles;