# Image with text

Choose left or right position of image with image alignment:

![Ideal for alternating image position when using multiple times](https://3450226476-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MI6cK8SrstUdE_nxQrW%2F-MV-3ycJl2Nl2ikpBtxT%2F-MV2tkT0kgKO-beSUToZ%2FScreen%20Shot%202021-03-05%20at%2011.39.09%20AM.png?alt=media\&token=19d1a6ec-dc60-49f8-a997-c226a6983142)

![Text background color changes when darker background is chosen](https://3450226476-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MI6cK8SrstUdE_nxQrW%2F-MV-3ycJl2Nl2ikpBtxT%2F-MV2v28qemQDchJS6W8G%2FScreen%20Shot%202021-03-05%20at%2011.45.04%20AM.png?alt=media\&token=790bd16a-e58b-4742-af2f-1108a8f0161a)

Clean mobile stacking with text card overlapping image:

![](https://3450226476-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MI6cK8SrstUdE_nxQrW%2F-MV-3ycJl2Nl2ikpBtxT%2F-MV2w0M7wBFb2gkCrqGi%2FKapture%202021-03-05%20at%2011.48.52.gif?alt=media\&token=12858f49-b939-40d1-882d-f19df4efd899)

#### *Add section reference:*

<div align="left"><img src="https://3450226476-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MI6cK8SrstUdE_nxQrW%2F-MV--Cz_IhSNkckVLPha%2F-MV--M1IDopZKrl_-DhG%2Fimage-with-text.png?alt=media&#x26;token=e0cc8467-eae0-4480-a96c-9df70ca494b1" alt=""></div>
