---
title: "Slide Image Txt Mask — Free Framer component · Best of Framer"
description: "Free Framer component · by Troy Miller · Text. Classic Mask Text with a twist"
canonical: "https://framer.elliotli.dev/component/slide-image-txt-mask"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Slide Image Txt Mask

# Slide Image Txt Mask

Classic Mask Text with a twist

[View on Framer](https://framer.com/marketplace/components/slide-image-txt-mask/?via=elliot-li)

![Slide Image Txt Mask preview image 1](https://framer.elliotli.dev/og/component/slide-image-txt-mask/d57c5cb3e6a3ac4f/1600x1200.jpg)

## Summary

Classic Mask Text with a twist

## Description

**Image Mask Text** is a Framer code component that lets you display text with a fully animated image slideshow masked inside the letterforms — creating a striking visual effect where your images appear to live within the text itself.

Upload as many images as you want and set a custom slide duration to control the pace of the animation. Each transition crossfades smoothly between images, keeping the effect polished without any extra configuration. Choose from three image fit modes — Cover, Contain, or a custom Percent scale — to get exactly the framing you want inside your text.

Full font controls give you command over size, weight, style, letter spacing, line height, and alignment. A fallback text color kicks in automatically when no image is provided, so the component always looks intentional in every state.

**Features**

-   Animated image slideshow masked into text
    
-   Add unlimited images via the property panel
    
-   Adjustable slide duration (0.5s – 30s)
    
-   Smooth 400ms crossfade between slides
    
-   Three image fit modes: Cover, Contain, Percent
    
-   Extended font controls including size, weight, style, spacing, and alignment
    
-   Solid color fallback when no image is set
    
-   Clean, minimal setup — no code required
    

Ideal for hero sections, landing page headlines, portfolio headers, and anywhere you want type that genuinely stops the scroll.

For design work, questions, or help, please reach out at [https://www.fireislanddesign.com/](https://www.fireislanddesign.com/)

## Rank history [How rankings work →](/terms#rankings)

-   All · #6047

## Details

- **Author**: Troy Miller
- **Published**: 2026-02-19
- **Updated**: 2026-06-12
- **Added**: 2026-02-18
- **Categories**: Text

## More like this

-   [Text Reveal Effect](/component/text-reveal-effect) — Lera · $4 — Text reveal effect over "ghost" layer.
-   [Soft Heading](/component/soft-heading) — Kaisa A · Free — Animated Soft Heading in 2 colors
-   [Curved Text Marquee](/component/curved-text-marquee) — Ahmet Loca · Free — Animated Bend
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing