---
title: "Ripped Paper Text — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Cray · Text. Ripped Paper Text Component Add instant texture and a raw, organic feel to your layouts."
canonical: "https://framer.elliotli.dev/component/ripped-paper-text"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Ripped Paper Text

# Ripped Paper Text

Ripped paper effect on your text

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

![Ripped Paper Text preview image 1](https://framer.elliotli.dev/og/component/ripped-paper-text/a193953275a5d6f7/1600x1200.jpg)

## Summary

Ripped Paper Text Component Add instant texture and a raw, organic feel to your layouts.

## Description

## Ripped Paper Text Component

Add instant texture and a raw, organic feel to your layouts. This reusable component wraps your text in a realistic torn-paper aesthetic, perfect for digital scrapbooks, editorial headers, or any design that needs a "handmade" touch. Instead of static images, this component gives you full control over the paper’s shape, color, and typography.

### Key Features

-   **Selective Edge Tearing:** Choose exactly which sides are ripped. Tear all four edges for a floating scrap look, or leave some edges clean to "anchor" the paper to the sides of your containers.
    
-   **Dynamic Styling:** \* **Custom Colors:** Change both the paper and the text color independently to match your brand palette.
    
    -   **Typography Support:** Fully customizable fonts allow you to pair the rugged paper look with everything from elegant serifs to bold grotesque typefaces.
        
-   **Spatial Controls:**
    
    -   **Adjustable Padding:** Control the "breathability" of your text by increasing or decreasing the space between the letters and the torn edges.
        
    -   **Depth & Shadows:** Toggle a customizable shadow to lift the paper off the page, creating a realistic 3D layered effect.
        
-   **Fully Reusable:** Designed as a flexible wrapper, you can drop this into any section of your site and update the content instantly without breaking the effect.
    

### How to Use

Simply drag the component onto your canvas and type your message. Use the property panel to "rip" specific edges and tweak the padding until the composition feels balanced. It’s an ideal choice for callouts, highlight sections, or navigation elements that need to stand out.

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

-   All · #8723

## Details

- **Author**: Cray
- **Price**: $5.00
- **Published**: 2026-04-30
- **Updated**: 2026-04-30
- **Added**: 2026-04-29
- **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
