Flutter & Dart Tools

Flutter BorderRadius Generator

Build a BorderRadius expression for a Flutter decoration or clipping widget. A circular radius applies the same curvature to all corners, while the per-corner mode prints BorderRadius.only with individual Radius.circular values. The generated code uses logical pixels and physical corner names. It does not change widget size, apply a clipping behavior or create a decoration automatically. Start with the corner values in your design specification and check the result on the actual widget dimensions. Check both the decoration and its child when reviewing the finished component.

Your workspace

Runs locally in your browser

Only values for the selected constructor are used.

Result

Your input is processed locally in your browser unless explicitly stated otherwise. Inputs are not saved by this tool.

How to use this tool

Choose Circular or Per corner, enter non-negative radii and copy the generated Dart expression.

Example

Input

Circular radius: 12

Output

BorderRadius.circular(12)

What does this tool do?

BorderRadius.circular(12) is a concise choice for matching corners. BorderRadius.only lets a panel round its top corners while keeping the bottom corners square. A value of zero means a square corner. The generator accepts finite values from zero to 10000; very large radii are interpreted by Flutter relative to the available rectangle.

Common mistakes and limitations

A border radius on BoxDecoration paints a rounded background but does not necessarily clip the child. Use a suitable clipping widget or clip behavior when an image or other child must follow the rounded boundary. Clipping and shadows interact: clipping too tightly can cut off a shadow you intended to show outside the box.

Frequently asked questions

Will this round an image automatically?

No. The expression describes radii; image clipping must be configured by the widget using it.

Related tools