How to remove underline in TextInput in React Native?

Sometimes, we want to remove underline in TextInput in React Native.

In this article, we’ll look at how to remove underline in TextInput in React Native.

How to remove underline in TextInput in React Native?

To remove underline in TextInput in React Native, we can set the underlineColorAndroid prop to transparent.

For instance, we write:

import * as React from 'react';
import { TextInput, View } from 'react-native';
import Constants from 'expo-constants';
import { Card } from 'react-native-paper';

export default function App() {
  return (
    <View style={{ padding: 30 }}>
      <TextInput underlineColorAndroid="transparent" placeholder="Name" />
    </View>
  );
}

to set the underlineColorAndroid prop of the TextInput to 'transparent' to remove the TextInput underline.

Conclusion

To remove underline in TextInput in React Native, we can set the underlineColorAndroid prop to transparent.