How to change textformfield color in flutter

How to Change TextFormField Color in Flutter

To change the color of a TextFormField in Flutter, you can make use of the decoration property of the TextFormField widget. The decoration property allows you to modify the visual appearance of the input field, including the color.

Example

Let’s say you have a TextFormField that you want to change the color of:

    
      TextFormField(
        decoration: InputDecoration(
          labelText: 'Username',
          labelStyle: TextStyle(
            color: Colors.blue,  //<-- Change the color here
          ),
          // Additional decoration properties...
        ),
      )
    
  

In the above example, the color property within the TextStyle widget is set to Colors.blue, which will result in the label text of the TextFormField being displayed in blue color.

You can also change the color of other parts of the TextFormField, such as the border, background, or hint text, by modifying the respective properties within the InputDecoration widget.

    
      TextFormField(
        decoration: InputDecoration(
          labelText: 'Password',
          labelStyle: TextStyle(
            color: Colors.red,  //<-- Change the color here
          ),
          enabledBorder: OutlineInputBorder(
            borderSide: BorderSide(color: Colors.yellow), //<-- Change border color here
          ),
          filled: true,
          fillColor: Colors.grey, //<-- Change the background color here
          hintText: 'Enter your password',
          hintStyle: TextStyle(
            color: Colors.green, //<-- Change the hint text color here
          ),
        ),
      )
    
  

In the above example, the label text color is set to red, the border color is set to yellow, the background color is set to grey, and the hint text color is set to green. Modify these properties as per your needs to achieve the desired color scheme for your TextFormField.

Leave a comment