i all so have the same issue // Green Elliptical Shape at Top with Blur effect Positioned( top: -56, left: 216, child: ClipOval( child: BackdropFilter( filter: ImageFilter.blur(sigmaX: 250, sigmaY: 250), // Top ellipse blur (Figma: 250) child: Container( width: 350, height: 233, decoration: BoxDecoration( color: Color.fromRGBO(30, 176, 86, 1).withOpacity(0.6), // Green with transparency borderRadius: BorderRadius.all(Radius.elliptical(350, 233)), ), ), ), ), ),
// Brown Elliptical Shape at Bottom with Blur effect
Positioned(
top: 763,
left: -255,
child: ClipOval(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 100, sigmaY: 100), // Bottom ellipse blur (Figma: 100)
child: Container(
width: 468,
height: 308,
decoration: BoxDecoration(
color: Color.fromRGBO(92, 59, 21, 1).withOpacity(0.6), // Brown with transparency
borderRadius: BorderRadius.all(Radius.elliptical(468, 308)),
),
),
),
),
),
// Circle with Shadow (Top Ellipse Shadow)
Positioned(
top: -90,
left: 150,
child: Container(
height: 80,
width: 80,
decoration: const BoxDecoration(
shape: BoxShape.circle,
boxShadow: [
BoxShadow(blurRadius: 30, spreadRadius: 2, color: Colors.green),
],
),
),
),
// Radial Gradient Circle (Bottom Ellipse Gradient Effect)
Positioned(
top: 735,
left: -220,
child: Container(
height: 80,
width: 80,
decoration: const BoxDecoration(
shape: BoxShape.circle,
gradient: RadialGradient(
colors: [
Color.fromRGBO(92, 59, 21, 1),
Color.fromRGBO(92, 59, 21, 1).withOpacity(0.5),
Color.fromRGBO(92, 59, 21, 1).withOpacity(0.1),
],
),
),
),
),
],
),
),
);
} }