Text inside Pressable has a different background color

Question

I want to create a custom button using Pressable and Text. My problem is that the Text component has a slightly different background color than the rest of my button. This is how my Component looks like

<Pressable
  android_ripple={{ color: '#444242' }}
  style={{
    paddingHorizontal: 15,
    paddingVertical: 12,
    backgroundColor: getBackgroundColor(type),
    alignItems: 'center'
  }}
  onPress={onPress}
>
  <Text
    style={{
      color: getColor(type),
      fontWeight: 'bold',
      fontSize: 17
    }}
  >
    {label}
  </Text>
</Pressable>

I get my colors depending on my button type using these functions

const getBackgroundColor = (type) => {
  switch (type) {
    case 'primary':
      return colors.main;
    case 'success':
      return colors.success;
    default:
      return 'white';
  }
}
const getColor = (type) => {
  switch (type) {
    case 'primary':
      return 'white';
    case 'success':
      return 'white';
    default:
      return 'black';
  }
}

My component looks like this. As you can see the "Text" background has a slightly different shade.