---
title: "PDF to FlipBook — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Martina Gazenova · Interactive. Turn any PDF into a flip book"
canonical: "https://framer.elliotli.dev/component/pdf-to-flipbook"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/PDF to FlipBook

# PDF to FlipBook

Turn any PDF into a flip book

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

![PDF to FlipBook preview image 1](https://framer.elliotli.dev/og/component/pdf-to-flipbook/4f540571beb0ec00/1600x1200.jpg)

## Summary

Turn any PDF into a flip book

## Description

**Flipbook** turns a PDF or set of images into an interactive, page-turning book directly on your Framer site. Pages curl and lift as they turn, with drag, swipe, and click interactions for a realistic reading experience.

Use it for pitch decks, portfolios, catalogs, magazines, lookbooks, or any document you want visitors to browse instead of scroll.

### Content Types

-   **Images** — Upload pages directly for instant loading.
    
-   **PDF** — Upload a PDF and Flipbook automatically converts each page into an image when the page first loads. Larger PDFs may take slightly longer to appear.
    

### Display Modes

-   **Presentation** — One page at a time. Choose **Fill Frame** or **Custom Width**.
    
-   **Magazine** — Two-page spread, like an open book.
    

### Customization

Control everything directly from Framer’s properties panel: background color, page shadows, corner radius, arrow color and size, progress bar, page numbers, flip speed, and autoplay. You can also add a clickable logo button to any corner. No code required.

### How to Use

1.  Add the component to your Framer page and set its frame size.
    
2.  Choose **Images** or **PDF** as your content type.
    
3.  Select **Presentation** or **Magazine** display mode.
    
4.  Customize colors, navigation controls, and page settings.
    
5.  Optionally enable the logo button and add a link.
    
6.  Set flip speed and autoplay if desired.
    
7.  Test the interaction using clicks, drags, or swipes. Arrow buttons and the progress bar can also be used for navigation.
    

For questions or support, contact [**contact@gazenova.com**](mailto:contact@gazenova.com).

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

-   All · #5364

## Details

- **Author**: Martina Gazenova
- **Price**: $10.00
- **Published**: 2026-08-31
- **Updated**: 2026-10-06
- **Added**: 2026-08-31
- **Categories**: Interactive

## More like this

-   [Velvet Curtain](/component/velvet-curtain) — Sarthak Prakash · $12 — Cinematic curtain reveal effect
-   [Image-Compare Slider](/component/image-compare-slider) — Studio Digital · Free — Reveal what changed, beautifully
-   [Lesson Packages](/component/lesson-packages) — Shelfless Studio · $9 — Lesson bundles with savings shown
-   [Deskbell AI Chatbot](/component/deskbell-ai-chatbot) — NS. Studio · Free — AI site chat, works with Chatbase