Am sharing my code also attaching the scrsht of what I am getting. anyone if know neumorphic design will know what I want to achieve.this is what I am getting for now : -

//This is my CustomClipClass
class CustomClipPath extends CustomClipper<Path> {
@override
Path getClip(Size size) {
var height = size.height;
var width = size.width;
var path = Path();
var roundFactor = 40.0;
path.moveTo(0.0, height / 3);
path.lineTo(0, height - roundFactor);
path.arcToPoint(Offset(roundFactor, height),
clockwise: false, radius: Radius.circular(roundFactor));
path.lineTo(width - roundFactor, height);
path.arcToPoint(Offset(width, height - roundFactor),
clockwise: false, radius: Radius.circular(roundFactor));
path.lineTo(width, roundFactor);
path.quadraticBezierTo(width, 0, width - roundFactor * 3, roundFactor + 20);
path.quadraticBezierTo(
0, (height / 3) * 0.99, 0, (height / 3) + roundFactor);
return path;
}
@override
bool shouldReclip(CustomClipper<Path> oldClipper) => true;
}
this is my scaffold:
return Scaffold(
backgroundColor: primaryColor,
body: SafeArea(
child: Center(
child: Container(
height: 300,
width: 200,
decoration: const BoxDecoration(boxShadow: [
BoxShadow(
offset: Offset(-20, -20),
color: Color(0xff481d64),
blurRadius: 20),
BoxShadow(
offset: Offset(20, 20),
color: Color(0xff36154a),
blurRadius: 20)
]),
child: ClipPath(
clipper: CustomClipPath(),
child: Container(
decoration: BoxDecoration(
color: primaryColor,
),
),
),
),
)),
);
I am expecting to have a neumorphic look for my custom clipped widget using the boxshadow .