Flutter Neumorphism

A flutter web application for Neumorphic UI Dart code generation.

Link to the application

Check out the app at https://neelansh-ns.github.io/Flutter-Neumorphism

Neumorphism

Neumorphism is a new word for the new user interface trend. Since this is a hard word to pronounce, some say Soft UI.

Let us start with the root of the word “Neumorphic”. It is a combination of 2 words. Neu and Morphic: Neu: New + Morphic: a variant of Morphous, meaning having a specific shape or form. This word was also used in an old interface design trend called Skeumorphic.

Features

Neumorphic Flutter widgets code generator that will help with colors, gradients, and shadows to adapt to this new design trend or discover its possibilities.

Type the color hexcode(eg. 'ffffff') or use the color picker to change the color of the Container.

Use the sliders to adjust:

• Size
• Radius
• Distance
• Intensity
• Blur

Use the buttons to toggle:

• Background Gradient
• Concave/Convex shape

Finally click COPY to copy the code to the clipboard.

Inspiration

Adam Giebl's https://neumorphism.io, which generates CSS code for neumorphic elements, was a great source of inspiration. A little bit of exploration helped me understand the quick maths behind that. ;)