How to Recreate Stripe’s Lava Lamp Gradient with Three.js

A video coding session where you’ll learn how to recreate the lava lamp like gradient from Stripe.

By Yuri Artiukh in Videos on September 26, 2022

In this new ALL YOUR HTML coding session you’ll learn how to code the cool lava lamp like gradient with Three.js and shaders.

Original: https://stripe.com/

Minigl version derived: https://whatamesh.vercel.app/

This coding session was streamed live on September 25, 2022.

Check out the live demo.

Support: https://www.patreon.com/allyourhtml

Setup: https://gist.github.com/akella/a19954…

Yuri Artiukh

Yuriy is a developer from Kyiv, Ukraine. Leading a small frontend agency riverco.de, also speaking at conferences, and open for freelance projects. Curious about CSS and shaders. Loves to learn every day.

three.js webgl

Master JavaScript Animation with GSAP – Perfect for Beginners! Get full, free access to 34 video lessons, step-by-step projects, and hands-on demos. Enroll for free →

Yuri Artiukh

Mastering Theatre.js Animations: Learn to Create Dynamic Visuals

Conway’s Game Of Life – Cellular Automata and Renderbuffers in Three.js

Alternate Column Scroll Animation

Stay in the loop: Get your dose of frontend twice a week