how to create vertical linear gradient in flutter?

February 1, 2023

I am trying to create a vertical lineargradient i.e from top-center to bottom-center like this image.

I have come up with this code which creates diagonal gradient from top-left to bottom-right. How can I get a vertical linear-gradient instead?

 Container(
      height: 550,
      width: 550,
      decoration: BoxDecoration(
                    gradient: LinearGradient(
                      begin: Alignment.topCenter,
                      end: Alignment(0.9, 0.1),
                      colors: [opFireOrange, fireOrange]
                     ),
                    borderRadius: BorderRadius.all(Radius.circular(6.0)),
         ),
    ),

>Solution :

You should change the end: Alignment(0.9, 0.1) to end: Alignment.bottomCenter and add the stops List to LinearGradient, the code below should produce the desired vertical linear gradient in flutter:

LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          stops: [0.9, 0.1],
          colors: [opFireOrange, fireOrange],
),