How to change the shape of chip in flutter

You can use shape property of the Chip widget. In that property you can pass RoundedRectangleBorder() and mention borderRadius inside of the RoundedRectangleBorder(). There are other ShapeBorders like BeveledRectangleBorder(), StadiumBorder(),OutlineInputBorder(),ContinuousRectangleBorder() and so on.

A code is given below using RoundedRectangleBorder():

    Chip(
      backgroundColor: Color(0xFFE1E4F3),
      padding: const EdgeInsets.symmetric(vertical: 15,horizontal: 5),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.only(topRight: Radius.circular(20),bottomRight: Radius.circular(20))),
      label: Text("Custom Chip Shape",
        style: TextStyle(
          fontSize: 16,
          fontWeight: FontWeight.w600,
          color: Color(0xFF3649AE)
          ),
        )
      );

enter image description here

Hope this helps you out!!


I had to place the chip inside a container then match the background colours.

  new Container(
    decoration: new BoxDecoration(
      color: Colors.blue.shade100,
      borderRadius: new BorderRadius.only(
          topRight: Radius.circular(30.0), bottomRight: Radius.circular(30.0)),
      border: new Border.all(color: Color.fromRGBO(0, 0, 0, 0.0)),
    ),
    child: new Chip(
      label: new Text('Order Created',
          style: new TextStyle(fontSize: 20.0, color: Colors.blueGrey)),      
    ),
  );