Use .img-fluid class to the img tag to get responsive image.

<div className="text-center">
 <img src={ "../../../assets/images/media/media-48.jpg"} className="img-fluid" alt="..."/>
</div>

Use .rounded class along with .img-fluid to get border radius.

<div className="text-center">
<img src={"../../../assets/images/media/media-49.jpg"} className="img-fluid rounded" alt="..."/>
</div>

Use .rounded-pill class to img tag to get rounded image.

<div className="text-center">
<img src={"../../../assets/images/media/media-50.jpg"} className="img-fluid rounded-pill" alt="..."/>
</div>

<img className="rounded float-start" src={ "../../../assets/images/media/media-53.jpg"} alt="..."/>

 <img className="rounded mx-auto d-block" src={ "../../../assets/images/media/media-55.jpg"} alt="..."/>

<img className="rounded float-end" src={"../../../assets/images/media/media-54.jpg"} alt="..."/>

<figure className="figure">
<img className="bd-placeholder-img figure-img img-fluid rounded card-img" src={"../../../assets/images/media/media-56.jpg"} alt="..."/>
<figcaption className="figure-caption">A caption for the above image.
</figcaption>
</figure>
<figure className="figure float-end">
<img className="bd-placeholder-img figure-img img-fluid rounded card-img" src={"../../../assets/images/media/media-57.jpg"} alt="..."/>
<figcaption className="figure-caption text-end">A caption for the above image.
</figcaption>
</figure>

Use .img-thumbnail to give an image a rounded 1px border.

 <div className="text-center">
<img src={"../../../assets/images/media/media-51.jpg"} className="img-thumbnail" alt="..."/>
 </div>

Use .rounded-pill along with .img-thummbnail to get radius.

<div className="text-center">
<img src={"../../../assets/images/media/media-52.jpg"} className="img-thumbnail rounded-pill" alt="..."/>
</div>