Sometimes we also wonder how people do things in Paper haha Not quite a tutorial but here is what I did: - grabbed a screenshot from video - asked chatgpt to get me a b/w svg image with frame and dots - saved the pic - opened the Heatmap shader on - replaced the default input shape with my svg - tweaked the colors It's not accurate but gives you the idea!
237,553 views
I'm making a bunch of fun things for Paper these days - sharing soon But for now, here’s a little toy we made to give your logo that Apple-style look! live: repo: #AppleLaunch
217,254 views
Paper blog is here! We explore retro print aesthetics with our new HalftoneCMYK shader. I break down the tech tricks behind it, and Agu Seguí shows how to use it Plenty of interactive illustrations (and plenty of banana pictures). Enjoy! read: paper app: shader docs:
39,345 views
It’s time to start sharing the shaders I’ve been making for Paper! DotOrbit is the first one shaders demo & docs: paper: If you run into a bug or have a suggestion, feel free to dm
51,068 views
Little Christmas tutorial🎄 Here's how you make all those liquid metal buttons: 1. open 2. choose one of the predefined shapes or upload your own image 3. polish the look using the sliders 4. copy it as a React component docs:
40,855 views
It's October, my dudes! I've redone one of my fav old works. The updates: - transparent background - no extra libs so just <15kb of code - parameters that are easy to change without going through the shader Live demo & source code: Hosted on CodePen.IO
99,629 views
Oops, we did it again! Turn your logo into an Apple-like animation, play with controls, export as a React component or video file Try Paper, no invite needed🤫 live: all paper shaders: #AppleLaunch
46,102 views
Rube Goldberg HTML form! Tbh I spent way too much time on this one haha. As fun as it is useless :) Live demo & source code: Hosted on CodePen.IO Made with #GSAP GSAP
65,417 views
I wanted to create a broken glass effect with WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IO
43,826 views
Voronoi diagram with perfect cell boundaries <Voronoi /> is another React component from our Paper-design/shaders package All glory to inigo quilez for original algo (such a big fan I am!) shaders demo & docs: paper app:
25,459 views
This glass configurator has no custom shaders or geometries. Just MeshPhysicalMaterial and a bunch of standard geometries with rendering order set manually. Not 100% realistic but super simple Live demo & source code: Made with Three.js Hosted on CodePen.IO
59,771 views
Another minimal JS animation here! Interactive (and damn satisfying) cursor animation made with only 3kb of pure JS. Not sure how to use it yet – maybe as a base for some shader?.. Anyway, it's fun already :) Live demo & source code: Hosted on CodePen.IO
52,889 views
If I had to choose one thing to do, it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders
51,886 views
New #WebGL pattern! A Voronoi diagram (love it) with eyes calculated over the polar coordinates of each cell. No images or graphic libs here, just a #GLSL shader wrapped with JS Live demo & source code: Hosted on CodePen.IO Special thx to The Book of Shaders
35,396 views
Draw GLSL flowers with your cursor! 🌺 One full-screen plane, two render targets, and a bit of shader magic Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders #webgl #glsl #threejs #shader #drawingtool
28,620 views
New favorite noise function! I had lots of fun tweaking the yonatan shader and ended up using it as a semi-transparent overlay With color changing on scroll and slight cursor response, the total code size is still <9 kb 🫣 Live demo & source code: Original algorithm:
20,374 views
GLSL fire shader based on Simplex noise with a static SVG overlay. No interactivity this time, just sketching on Saturday night ¯\_(ツ)_/¯ Live demo & source code: Made with Three.js Hosted on CodePen.IO