Here is my expected design:

Here is how it currently looks with the code below:

Current code:

I have tried this code with radius circle:

Using Radius.circular but this still doesn’t result in the expected outcome, it instead shows up as not correct icon still cornered:

>Solution :

Change BeveledRectangleBorder to RoundedRectangularBorder

Use the following code:

return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        backgroundColor: const Color.fromRGBO(238, 0, 0, 1),
        shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
                topRight: Radius.circular(20),
                bottomLeft: Radius.circular(100),
                bottomRight: Radius.circular(100),
                topLeft: Radius.circular(100))),
      ),
    );

Output: