Flutter Gradient Generator

fluttergradientgenerator.com

Flutter Gradient Generator is a web app that generates linear, radial and sweep gradients for Flutter widgets.

Usage

1. Visit the web app.

2. Choose the gradient style.

   The options are:

   • linear
   • radial
   • sweep

3. Choose the gradient direction.

   The options are:

   • top-left
   • top-center
   • top-right
   • center-left
   • center (not applicable for linear gradient)
   • center-right
   • bottom-left
   • bottom-center
   • bottom-right
   • custom

4. Choose the gradient colors.

   You can:

   • use the color pickers to select your colors,
   • click on a gradient sample to use the sample's colors,
   • use a random gradient sample by clicking on the button,
   • add more colors by clicking the + button.

5. Enter the color stops.

6. Click on "Copy Gradient Code" and the code will be copied to your clipboard.

Running

1. Clone the repository

   git clone https://github.com/victoreronmosele/flutter_gradient_generator.git
   

2. Cd into the folder

   cd flutter_gradient_generator
   

3. Run the app

   flutter run 
   

Roadmap

• Linear gradient
• Radial gradient
• Sweep gradient
• Color picker
• Color stops
• Addition of more colors
• Gradient samples
• Downloading gradient as image
• Addition of more gradient styles
• Text gradients
• CSS to Flutter converter
• Dark mode

Contact

Project Link: https://github.com/victoreronmosele/flutter_gradient_generator

Acknowledgments

• Gradient samples are from uiGradients.

License

Distributed under the GPL 3.0 License. See LICENSE.txt for more information.