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

Built with Material Design for Bootstrap - free and powerful Bootstrap UI KIT

Download MDB UI KIT Learn more Tutorials GitHub

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="...">