In addition to our , you can use .img-thumbnail to give an image a rounded 1px border appearance.

<img src="..." class="img-thumbnail" alt="...">

Align images with the helper float classes or . block-level images can be centered using the margin utility class.

<img src="..." class="rounded mx-auto d-block" alt="...">

If you are using the <picture> element to specify multiple <source> elements for a specific <img>, make sure to add the .img-* classes to the and not to the <picture> tag.

  <source srcset="..." type="image/svg+xml">
  <img src="..." class="img-fluid img-thumbnail" alt="...">