3D Book Component for Framer

Copy component

3D Book Component for Framer

Copy component

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Component

3D Book Component for Framer

This is an interactive 3D book component for Framer. You can simply copy and paste it into your project, then customize it using the component properties. It's really easy!

image of Nandi Muzsik
profile image of Adam Majmudar
image of Clement Lionne

Created by

3D Book Component for Framer
3D Book Component for Framer
3D Book Component for Framer

About the resource

The component is designed to be fully customizable. You can upload a cover image of the book, change the title displayed on the spine, or change the size of the component.

About the resource

The component is designed to be fully customizable. You can upload a cover image of the book, change the title displayed on the spine, or change the size of the component.

About the resource

The component is designed to be fully customizable. You can upload a cover image of the book, change the title displayed on the spine, or change the size of the component.

3D book component properties

3D book component properties.

3D book component properties

3D book component properties.

3D book component properties

3D book component properties.

The component is designed so it features an "Open" and a "Close" variant. This allows you to tailor any custom interaction with it.

For example, in this demo, I wrapped some 3D books in a container and transformed that into a component. I created multiple variants for this component, and in each variant, a different book is open. These variants are connected with interactions, so when a book gets a hovered, we switch to the variant where that specific book is open. And of course, we can also trigger the same interaction with a click.

The component is designed so it features an "Open" and a "Close" variant. This allows you to tailor any custom interaction with it.

For example, in this demo, I wrapped some 3D books in a container and transformed that into a component. I created multiple variants for this component, and in each variant, a different book is open. These variants are connected with interactions, so when a book gets a hovered, we switch to the variant where that specific book is open. And of course, we can also trigger the same interaction with a click.

The component is designed so it features an "Open" and a "Close" variant. This allows you to tailor any custom interaction with it.

For example, in this demo, I wrapped some 3D books in a container and transformed that into a component. I created multiple variants for this component, and in each variant, a different book is open. These variants are connected with interactions, so when a book gets a hovered, we switch to the variant where that specific book is open. And of course, we can also trigger the same interaction with a click.

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

More resources

More resources

  • The image displays a morphing tab navigation menu with "Home" highlighted in blue and a hover interaction over "Change"

    Morphing Tabs Interaction in Framer

    Component

    The image displays a morphing tab navigation menu with "Home" highlighted in blue and a hover interaction over "Change"

    Morphing Tabs Interaction in Framer

    Component

    The image displays a morphing tab navigation menu with "Home" highlighted in blue and a hover interaction over "Change"

    Morphing Tabs Interaction in Framer

    Component

  • Decorative store banner with icons and blue text pill design

    Magnetic Hover Component for Framer

    Component

    Decorative store banner with icons and blue text pill design

    Magnetic Hover Component for Framer

    Component

    Decorative store banner with icons and blue text pill design

    Magnetic Hover Component for Framer

    Component