Lightbox | Dreams AI Agent - Agent Builder Tailwind Admin Template

Single Image Lightbox



<div class="flex gap-4"> 
	<a href="assets/img/card/card-01.jpg" class="image-popup">
		<img src="assets/img/card/card-01.jpg" alt="image" class="h-full">
	</a>
	<a href="assets/img/card/card-02.jpg" class="image-popup">
		<img src="assets/img/card/card-02.jpg" alt="image" class="h-full">
	</a>
	<a href="assets/img/card/card-03.jpg" class="image-popup">
		<img src="assets/img/card/card-03.jpg" alt="image" class="h-full">
	</a>
</div>

Image with Description



<div class="flex gap-4"> 
	<a href="assets/img/card/card-04.jpg" class="image-popup-desc" data-title="Title 01" data-description="Lorem ipsum dolor sit amet, consectetuer adipiscing elit">
		<img src="assets/img/card/card-04.jpg" class="img-fluid" alt="work-thumbnail">
	</a>
	<a href="assets/img/card/card-05.jpg" class="image-popup-desc" data-title="Title 01" data-description="Lorem ipsum dolor sit amet, consectetuer adipiscing elit">
		<img src="assets/img/card/card-05.jpg" class="img-fluid" alt="work-thumbnail">
	</a>
	<a href="assets/img/card/card-06.jpg" class="image-popup-desc" data-title="Title 01" data-description="Lorem ipsum dolor sit amet, consectetuer adipiscing elit">
		<img src="assets/img/card/card-06.jpg" class="img-fluid" alt="work-thumbnail">
	</a>
</div>