Home > Software design >  Make gradient effect at container flutter,
Make gradient effect at container flutter,

Time:12-26

how make gradient at flutter like this image?, i think this gradient make like 3D Effect

I found this design at dribble

CodePudding user response:

Try this:

        Container(
          width: 200,
          height: 240,
          child: Icon(Icons.android, size: 60, color: Colors.grey[100]),
          decoration: BoxDecoration(
              borderRadius: const BorderRadius.all(Radius.circular(42)),
              boxShadow: [
                BoxShadow(
                  color: Colors.deepOrange[400],
                  offset: const Offset(0, 20),
                  blurRadius: 30,
                  spreadRadius: -5,
                ),
              ],
              gradient: LinearGradient(
                  begin: Alignment.topLeft,
                  end: Alignment.bottomCenter,
                  colors: [
                    Colors.deepOrange[200],
                    Colors.deepOrange[300],
                    Colors.deepOrange[500],
                    Colors.deepOrange[500],
                  ],
                  stops: const [
                    0.1,
                    0.3,
                    0.9,
                    1.0
                  ])),
        ),

Result:

enter image description here

  • Related