Bootstrap rounded corners classes helps you to easily round its corners.

Detailed documentation and more examples you can find in our Bootstrap rounded corners Docs


Basic example

Border-radius

Finally, you can add classes to an element to easily round its corners.

100x100 100x100 100x100 100x100 100x100 100x100 150x75 100x100


<img src="..." alt="..." class="rounded mb-0">
<img src="..." alt="..." class="rounded-top">
<img src="..." alt="..." class="rounded-right">
<img src="..." alt="..." class="rounded-bottom">
<img src="..." alt="..." class="rounded-left">
<img src="..." alt="..." class="rounded-circle">
<img src="..." alt="..." class="rounded-pill">
<img src="..." alt="..." class="rounded-0">

Sizes

Use .rounded-lg or .rounded-sm for larger or smaller border-radius.

100x100 100x100


<img class="rounded-sm" alt="100x100" src="...">
<img class="rounded-lg" alt="100x100" src="...">