---
title: "Folded Type — Framer component · Best of Framer"
description: "$7.00 · Framer component · by DariStudio · Text. Folded Type turns a headline into a folded paper surface."
canonical: "https://framer.elliotli.dev/component/folded-type"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Folded Type

# Folded Type

A headline that folds like paper

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

![Folded Type preview image 1](https://framer.elliotli.dev/og/component/folded-type/de16bc9247c7e574/1600x1200.jpg)

## Summary

Folded Type turns a headline into a folded paper surface.

## Description

**Folded Type** turns a headline into a folded paper surface. The text is sliced into horizontal strips that fold open in 3D as the cursor moves over them — like window blinds, like a poster creasing in your hands. And there's a second message printed on the back: move along the word and `UNFOLD` breaks into folds that read `REVEAL`.

One surface, two messages. Use it for hero headlines, project titles, editorial and fashion sites, festival pages — anywhere a static headline is a wasted opportunity.

**How it works**

-   The headline itself is sliced and folded — real 3D, real backfaces, not a masked gimmick
    
-   The fold follows the cursor with a soft falloff; leave, and the surface smoothly flattens out
    
-   The back of every strip carries your second message on its own fill color
    
-   Fold depth is tunable from a subtle crease to a full flip-open
    

**Make it yours**

-   Front and back text, any font from the Framer font picker (size, weight, spacing)
    
-   Front color, back color, back fill
    

Type two messages, pick your colors, drop it in a hero. The fold does the talking.

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

-   All · #4111

## Details

- **Author**: DariStudio
- **Price**: $7.00
- **Published**: 2026-07-23
- **Updated**: 2026-07-23
- **Added**: 2026-07-23
- **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