Skip to content

plugin

Shaders by Paper

By Fred Moon

Details

Summary

Shaders by Paper brings paper.design 's open source WebGL shader library into Framer as native components.

Description

Shaders by Paper brings paper.design 's open source WebGL shader library into Framer as native components. Insert a shader from the gallery and every setting shows up as a regular Framer control: colors, sliders, toggles, and image inputs. Native Framer variants and transitions The most valuable and unique feature of this plugin is the support for Framer variants: you can wrap a shader inside a native Framer component and create as many variants as you need. This allows you to play with scroll triggers, scroll variants, hover states, clicks, etc. Basically all native Framer events and transitions. Demos & walkthrough Demo Site (Live link) Demo Video (YouTube) Walkthrough tutorial More demos and examples (x.com) Native easing curves For each of your variant, you can pick the easing and duration in the Transition control. Visitors who prefer reduced motion get the end state directly. 29 shaders, infinite combinations The library has 29 shaders in three categories: Image filters (6), such as Paper Texture and Fluted Glass Logo animations (3), such as Heatmap and Liquid Metal Effects (20), such as Mesh Gradient and Dot Orbit Each shader ships with its original presets. Import straight from Paper If you design in Paper, there is a shortcut: copy a shader on the Paper canvas and paste it into the plugin's Paste import tab. It becomes a Framer component with the same settings, ready to use. License The first shader in each category is free forever, with no watermark: Paper Texture, Heatmap, and Mesh Gradient. A one-year license unlocks the other 26 shaders and the paste import: 39€ for one Framer account or 149€ for a team key that covers five Framer accounts There is no subscription, and everything you placed keeps working even if the license expires. About Read the documentation here Shaders by Paper for Framer is an independent product, not affiliated with paper.design . The shaders come from the open source Paper Shaders library, released under the Apache 2.0 license.

Introduction

Library of interactive shaders

Media

Rank history

Daily rank per list, from the first snapshot — lower is better.

1112131338/148/228/309/79/15
  • All · #33