Create Beautiful UI in flutter using Neumorphism

If you also want to make beautiful and awesome User Interface apps in Flutter, hence increasing downloads on your app😉, then you are at the right place. In this article, I will introduce you to a package in Flutter that can be used to make apps with UI like this,-

Neumorphic UI app from here.

What’s Neumorphism?

An example to differentiate between cards. Taken from here.

Neumorphic card however pretends to extrude from the background. It’s a raised shape made from the exact same material as the background. When we look at it from the side we see that it doesn’t “float”.

This effect is pretty easy to achieve by playing with two shadows, one at negative values while the other at positive. But for it to work our background cannot be fully black or fully white. It needs at least a tiny bit of tint so both dark and “light” shadows will be visible. You can use any hue for the background so it can be warmer or colder depending on your choice. But white and dark shadows have to be visible on it, if slightly.

Flutter Package for creating Neumorphic UI

flutter_neumorphic from package.

The package that we can use in flutter to add neumorphic UI to your app is flutter_neumorphic.

This package can be used to make Neumorphic UI for our app. I too have used this package for building my apps in Flutter. You can read more about the package here.

If you liked this post or want me to give you a complete tutorial on making your first Neumorphic app in Flutter, do comment down.

And if you got to know about this package for the first time, then please give it a clap, that motivates me to keep researching for such awesome and amazing packages in Flutter, that we as a community can use to make great apps for our users.

THANK YOU!!!