# Flutter Tutorials – Widget Border Styling

In this article, I will be showing how to add border for Widgets and Style them.

Watch Video Tutorial
 

 

The Code is simple…

 

You have to use ‘BoxDecoration‘ and supply it to the ‘decoration‘ property of the widget you want to style the border.

 
BoxDecoration

 
The below methods returns a BorderDecoration.
 

To give borders to all sides at once…

 

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border.all(
      width: 1, 
    ),
  );
}

 
To apply different for different sides…
 

 BoxDecoration myBoxDecoration() {
    return BoxDecoration(
      border: Border(
        left: BorderSide(
          width: 2.0,
          color: Colors.green,
        ),
        right: BorderSide(
          width: 2.0,
          color: Colors.green,
        ),
        top: BorderSide(
          width: 2.0,
          color: Colors.green,
        ),
        bottom: BorderSide(
          width: 2.0,
          color: Colors.green,
        ),
      ),
      borderRadius: BorderRadius.all(
        Radius.circular(10.0),
      ),
    );
  }

 
All done.