I want to design like this in flutter, but not able to design since new to flutter?

i got you bro, try this template i made for you, i know it can be hard doing this kinda of stuff in flutter when you know very little, take a look at it

 class TestWidget extends StatelessWidget {
 const TestWidget({super.key});

 @override
 Widget build(BuildContext context) {
  return const Scaffold(
   body: Center(
     child: MyCustomCard(),
   ),
 );
 }
 }

 class MyCustomCard extends StatelessWidget {
 const MyCustomCard({Key? key}) : super(key: key);

 @override
 Widget build(BuildContext context) {
 return SizedBox(
  width: 150,
  height: 250,
  child: Stack(
    children: [
      buildBackground(),
      buildForeground(),
    ],
  ),
  );
  }

  Widget buildForeground() {
  return Padding(
  padding: const EdgeInsets.all(8.0),
  child: Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      const Text("Header"),
      Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            child: Container(
              height: 100,
              padding: const EdgeInsets.all(5),
              decoration: const BoxDecoration(
                borderRadius: 
       BorderRadius.all(Radius.circular(5)),
                color: Colors.white,
                boxShadow: [
                  BoxShadow(
                    color: Colors.black38,
                    blurRadius: 5,
                    spreadRadius: 5,
                  )
                ],
              ),
              child: const Text("Card Text"),
            ),
          ),
          Container(
            width: 20,
            height: 20,
            margin: const EdgeInsets.only(left: 5, top: 23),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(20),
              color: Colors.blue,
            ),
            child: const Center(child: Text("S")),
          )
        ],
      ),
      const Spacer(),
      const Text("Background"),
    ],
  ),
);

}

Column buildBackground() {
return Column(
children: [
Expanded(
flex: 1,
child: Container(
decoration: BoxDecoration(
color: Colors.purple,
borderRadius: BorderRadius.only(
topLeft: getRadius(),
topRight: getRadius(),
),
),
),
),
Expanded(
flex: 3,
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
bottomLeft: getRadius(),
bottomRight: getRadius(),
),
),
),
),
],
);
}

Radius getRadius() => const Radius.circular(5);
}