> For the complete documentation index, see [llms.txt](https://webvista-studio.gitbook.io/krank/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://webvista-studio.gitbook.io/krank/sections/media-and-layout/flexible-images.md).

# Flexible images

The Elastic Multi-Image Section creates a dynamic expand-and-collapse effect among image groups, delivering a sleek, interactive visual experience. Ideal for visual storytelling or showcasing a collection.

<figure><img src="https://3867724846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5cjsG9gBFSIZ5CisPtcx%2Fuploads%2F9V7S0SfL9EfYhVFewOFu%2Fimage.png?alt=media&amp;token=a2c33128-dd89-4e1c-a449-8723f88bf1eb" alt=""><figcaption></figcaption></figure>

#### 🖥️ Enable Full Width

Stretch the image area across the full page width for an immersive design effect.

***

### 🧱 Block Structure

**📷 Elastic Image**

* **Upload Images**: Recommended size is **1000 x 1000px**. Adjust image opacity to ensure text remains readable.
* **Image Quantity**: Upload **at least 6 images** to fully utilize the dynamic elasticity animation.

**🎨 Content Settings**

* **Color Scheme**: Customize text and button colors to maintain visual clarity over image backgrounds.
* **Content Position & Alignment**: Position text elements (e.g., bottom center, top left) as needed.

**📱 Mobile Settings**

* **Upload Separate Mobile Images**: Recommended size: **640 x 960px**
* **Custom Positioning**: Mobile content position and alignment can be set independently.

***

### 🧩 Available Content Blocks

Badge Group, Button, Button Group, Countdown, Description, Discount Code, Follow Us, Heading, Key Metrics, Icon, Icon with Text, Keywords, Link Group, Social Icons, Subheading, Video Button, Spacer

***

### ✅ Usage Tips

* Keep image styles consistent for a smooth visual flow
* Minimum 6 images recommended for full elastic animation effect
* Adjust text opacity and button placement for better usability
* Use mobile-specific settings to ensure proper scaling and readability
