Border class

A border of a box, comprised of four sides: top, right, bottom, left.

The sides are represented by BorderSide objects.

All four borders the same, two-pixel wide solid white:
Border.all(width: 2.0, color: const Color(0xFFFFFFFF))

The border for a material design divider:
Border(bottom: BorderSide(color: Theme.of(context).dividerColor))

A 1990s-era "OK" button:
  decoration: const BoxDecoration(
    border: Border(
      top: BorderSide(width: 1.0, color: Color(0xFFFFFFFFFF)),
      left: BorderSide(width: 1.0, color: Color(0xFFFFFFFFFF)),
      right: BorderSide(width: 1.0, color: Color(0xFFFF000000)),
      bottom: BorderSide(width: 1.0, color: Color(0xFFFF000000)),
  child: Container(
    padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 2.0),
    decoration: const BoxDecoration(
      border: Border(
        top: BorderSide(width: 1.0, color: Color(0xFFFFDFDFDF)),
        left: BorderSide(width: 1.0, color: Color(0xFFFFDFDFDF)),
        right: BorderSide(width: 1.0, color: Color(0xFFFF7F7F7F)),
        bottom: BorderSide(width: 1.0, color: Color(0xFFFF7F7F7F)),
      color: Color(0xFFBFBFBF),
    child: const Text(
      style: TextStyle(color: Color(0xFF000000))

See also:

  • BoxDecoration, which uses this class to describe its edge decoration.
  • BorderSide, which is used to describe each side of the box.
  • Theme, from the material layer, which can be queried to obtain appropriate colors to use for borders in a material app, as shown in the "divider" sample above.


Border({BorderSide top: BorderSide.none BorderSide right: BorderSide.none BorderSide bottom: BorderSide.none BorderSide left: BorderSide.none })
Creates a border. [...]
Border.all({Color color: const Color(0xFF000000), double width: 1.0, BorderStyle style: BorderStyle.solid })
A uniform border with all sides the same color and width. [...]
Border.fromBorderSide(BorderSide side)
Creates a border whose sides are all the same. [...]


bottom BorderSide
The bottom side of this border.
dimensions EdgeInsetsGeometry
The widths of the sides of this border represented as an EdgeInsets. [...]
read-only, override
hashCode int
The hash code for this object. [...]
read-only, override
isUniform bool
Whether all four sides of the border are identical. Uniform borders are typically more efficient to paint. [...]
read-only, override
left BorderSide
The left side of this border.
The right side of this border.
top BorderSide
The top side of this border. [...]
runtimeType Type
A representation of the runtime type of the object.
read-only, inherited


add(ShapeBorder other, { bool reversed: false }) Border
Attempts to create a new object that represents the amalgamation of this border and the other border. [...]
lerpFrom(ShapeBorder a, double t) ShapeBorder
Linearly interpolates from another ShapeBorder (possibly of another class) to this. [...]
lerpTo(ShapeBorder b, double t) ShapeBorder
Linearly interpolates from this to another ShapeBorder (possibly of another class). [...]
paint(Canvas canvas, Rect rect, { TextDirection textDirection, BoxShape shape: BoxShape.rectangle, BorderRadius borderRadius }) → void
Paints the border within the given Rect on the given Canvas. [...]
scale(double t) Border
Creates a copy of this border, scaled by the factor t. [...]
toString() String
Returns a string representation of this object.
getInnerPath(Rect rect, { TextDirection textDirection }) Path
Create a Path that describes the inner edge of the border. [...]
getOuterPath(Rect rect, { TextDirection textDirection }) Path
Create a Path that describes the outer edge of the border. [...]
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]


operator ==(dynamic other) bool
The equality operator. [...]
operator +(ShapeBorder other) ShapeBorder
Creates a new border consisting of the two borders on either side of the operator. [...]

Static Methods

lerp(Border a, Border b, double t) Border
Linearly interpolate between two borders. [...]
merge(Border a Border b) Border
Creates a Border that represents the addition of the two given Borders. [...]