---
title: "Fade Words Lite — Free Framer component · Best of Framer"
description: "Free Framer component · by knokknokD · Text. Make text arrive softly, without splitting layers by hand Fade Words Lite is a free Framer Code Component for simple word-by-word text reveals."
canonical: "https://framer.elliotli.dev/component/fade-words-lite"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Fade Words Lite

# Fade Words Lite

Free word-by-word text reveal

[View on Framer](https://framer.com/marketplace/components/fade-words-lite/?via=elliot-li)

![Fade Words Lite preview image 1](https://framer.elliotli.dev/og/component/fade-words-lite/375b4ed87072fd4b/1600x1000.jpg)

## Summary

Make text arrive softly, without splitting layers by hand Fade Words Lite is a free Framer Code Component for simple word-by-word text reveals.

## Description

## Make text arrive softly, without splitting layers by hand

Fade Words Lite is a free Framer Code Component for simple word-by-word text reveals. Add your sentence, adjust the font and timing, and use it in hero sections, intros, product pages, and editorial moments where the copy should feel a little more alive.

## Why it is different

\- Keeps the component intentionally light: one text field, Framer Font control, color, timing, distance, and replay.

\- Shows the finished text on Canvas so designing does not feel broken.

\- Respects reduced-motion settings and shows the full sentence without animation.

\- Uses one accessible sentence label while hiding the visual split words from screen readers.

\- Uses no external images, icons, or animation libraries.

## Key features

\- Word-by-word fade and upward reveal

\- Framer Font and Color controls

\- Adjustable speed, stagger, distance, and starting opacity

\- Play once or repeat on viewport re-entry

\- Canvas-safe editing state

\- Reduced-motion support

## Works well for

\- Hero headings

\- Section intros

\- Product launch pages

\- Portfolio opening copy

\- Short editorial statements

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

-   All · #7011

## Details

- **Author**: knokknokD
- **Published**: 2026-07-18
- **Updated**: 2026-10-06
- **Added**: 2026-07-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
