Images | Dreams AI Agent - Agent Builder Tailwind Admin Template

Rounded Image



<img class="rounded-lg" src="assets/img/card/card-02.jpg" alt="image">

Image Thumbnail



<img class="border-2 border-border-color rounded-lg" src="assets/img/card/card-02.jpg" alt="image">

Rounded Circle



<div class="flex items-center justify-center">
	<img class="rounded-full w-50" src="assets/img/avatar/avatar-01.jpg" alt="image">
</div>

Rounded Bordered



<div class="flex items-center justify-center">
	<img class="rounded-full border-2 border-border-color w-50" src="assets/img/avatar/avatar-01.jpg" alt="image">
</div>

Image Left Align



<img class="rounded-lg w-46" src="assets/img/card/card-02.jpg" alt="image">

Image Center Align



<div class="flex items-center justify-center">
	<img class="rounded-lg w-46" src="assets/img/card/card-02.jpg" alt="image">
</div>

Image Right Align



<div class="flex items-end justify-end">
	<img class="rounded-lg w-46" src="assets/img/card/card-02.jpg" alt="image">
</div>

Figures

A caption for the above image.



<div class="flex gap-6">
	<div>
		<img class="rounded-lg w-auto mb-2" src="assets/img/card/card-02.jpg" alt="image">
		<p class="text-start">A caption for the above image.</p>
	</div>  

	<div>
		<img class="rounded-lg w-auto mb-2" src="assets/img/card/card-02.jpg" alt="image">
		<p class="text-center">A caption for the above image.</p>
	</div>

	<div>
		<img class="rounded-lg w-auto mb-2" src="assets/img/card/card-02.jpg" alt="image">
		<p class="text-end">A caption for the above image.</p>
	</div> 
</div>