# Rounded corners

Rounds the corners of images with a radius of X pixels. If you wish to fill the cut corner(s) with a specific color, you can use the **bg\_color** parameter.

<mark style="color:orange;">**radius=X**</mark>  (all corners are rounded with radius X pixels)

<mark style="color:orange;">**radius=R1,R2,R3,R4**</mark> (values for each corner, with max being the min px of the 2 sides around corner)

If four values are provided, these values correspond to the four corners: R1 = top-left corner, R2 = bottom-left corner, R3 = bottom-right corner, R4 =top-right corner. For example, to round only one of the corners with the maximum possible radius, you need to use **radius=max,0,0,0**.

## Examples

<table><thead><tr><th width="373.5390625">Preview</th><th>Syntax</th></tr></thead><tbody><tr><td><div><figure><img src="https://727245914-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIDIcmPiz7q6Sr6ZHHQxV%2Fuploads%2FBarVQXKnVsaw7kJOskC4%2Fimage.png?alt=media&#x26;token=7b2ab6bd-3c08-4b5f-8b18-395a8b2f855d" alt="" width="300"><figcaption></figcaption></figure></div></td><td>Transparent corners (default, if the formats supports transparency):<br><a href="https://doc.cloudimg.io/https://samples.scaleflex.com/flat2.jpg?w=400&#x26;radius=25&#x26;force_format=png">/samples.scaleflex.com/flat2.jpg?<mark style="color:orange;"><strong>w=400</strong></mark>&#x26;<mark style="color:orange;"><strong>radius=25</strong></mark>&#x26;<mark style="color:orange;"><strong>force_format=png</strong></mark></a></td></tr><tr><td><div><figure><img src="https://727245914-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIDIcmPiz7q6Sr6ZHHQxV%2Fuploads%2FIj1CwIknezbUd72xegY8%2Fimage.png?alt=media&#x26;token=db6f98f9-3c2a-4d96-9e27-d5ac42983f16" alt="" width="300"><figcaption></figcaption></figure></div></td><td>Solid color corners:<br><a href="https://doc.cloudimg.io/https://samples.scaleflex.com/car1.jpg?w=400&#x26;radius=25&#x26;bg_color=cccc30">/samples.scaleflex.com/car1.jpg?<mark style="color:orange;"><strong>w=400</strong></mark>&#x26;<mark style="color:orange;"><strong>radius=25</strong></mark>&#x26;<mark style="color:orange;"><strong>bg_color=cccc30</strong></mark></a></td></tr><tr><td><div><figure><img src="https://727245914-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIDIcmPiz7q6Sr6ZHHQxV%2Fuploads%2F61TNlRAwqi71T1v3k3TX%2Fimage.png?alt=media&#x26;token=f3a6638a-2758-47d8-8e41-78b938760f3e" alt="" width="300"><figcaption></figcaption></figure></div></td><td>Maximum radius on two corners only:<br><a href="https://doc.cloudimg.io/https://samples.scaleflex.com/hotel.jpg?w=400&#x26;h=245&#x26;func=crop&#x26;radius=0,max,0,max">/samples.scaleflex.com/hotel.jpg?<mark style="color:$warning;"><strong>w=400</strong></mark>&#x26;<mark style="color:$warning;"><strong>h=245</strong></mark>&#x26;<mark style="color:$warning;"><strong>radius=0,max,0,max</strong></mark></a></td></tr></tbody></table>