Loading video...

Video Failed to Load

Go Home

Learn how we built our interactive 3D badge for Vercel Ship with React Three Fiber.

vercel's profile picture

Vercel

430,190 subscribers

274,679 views • 2 years ago •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

🧵How I made this interactive 3D scene with Blender and react-three-fiber
0:16

🧵How I made this interactive 3D scene with Blender and react-three-fiber

yasmin

145,085 views • 2 years ago

The hero on the latest Shopify Editions page was all built with React Three Fiber. Here’s how we did it 👇
0:16

The hero on the latest Shopify Editions page was all built with React Three Fiber. Here’s how we did it 👇

Daniel Beauchamp

53,894 views • 1 year ago

Card transition experiment with React Three Fiber + html-in-canvas. Try it here: Needs Chrome Canary for the interactive cards.
0:18

Card transition experiment with React Three Fiber + html-in-canvas. Try it here: Needs Chrome Canary for the interactive cards.

Zsolt Kacso

33,344 views • 1 month ago

Interactive 3d explorer with React Three Fiber. Worked with an artist to fix the topology and reduce the size of the CAD model. Custom LUT to more closely match the colour grade of the renders.
0:13

Interactive 3d explorer with React Three Fiber. Worked with an artist to fix the topology and reduce the size of the CAD model. Custom LUT to more closely match the colour grade of the renders.

Ben Leonard

12,314 views • 2 months ago

The Vercel Ship 2025 keynote starts in one hour. Hear from Guillermo Rauch, Lee Robinson, Tom Occhino, and more. Watch live on
0:18

The Vercel Ship 2025 keynote starts in one hour. Hear from Guillermo Rauch, Lee Robinson, Tom Occhino, and more. Watch live on

Vercel

20,380 views • 11 months ago

With Geist at its core, our updated logo is a refined, minimalist representation of our brand identity.
0:12

With Geist at its core, our updated logo is a refined, minimalist representation of our brand identity.

Vercel

249,658 views • 1 year ago

The world is fractured by wealth- a 3D fragile map of our divided world. 3D holographic globe that visualizes global economic inequality using the Gini Index data from World Bank. Spin the globe. Zoom in on any country. Built as a creative rendition of our economic ecosystem - beautiful, yet broken. #DataVisualization #ThreeJS #React #CreativeCoding #Geospatial #WebGL Three.js React-three-fiber
0:13

The world is fractured by wealth- a 3D fragile map of our divided world. 3D holographic globe that visualizes global economic inequality using the Gini Index data from World Bank. Spin the globe. Zoom in on any country. Built as a creative rendition of our economic ecosystem - beautiful, yet broken. #DataVisualization #ThreeJS #React #CreativeCoding #Geospatial #WebGL Three.js React-three-fiber

SHAHNAB AHMED

14,527 views • 2 months ago

React Native WebGPU 🤝 Three Fiber
0:17

React Native WebGPU 🤝 Three Fiber

William Candillon

37,636 views • 1 year ago

📣 We are bringing WebGPU to React Native! This update enables: 🚀 Modern GPU APIs (Vulkan & Metal) and enables general purpose GPU computation for AI/ML 🐎 Seamless Reanimated integration 🧊 Bringing stunning 3d experiences to React Native using ThreeJS and React Three Fiber
0:15

📣 We are bringing WebGPU to React Native! This update enables: 🚀 Modern GPU APIs (Vulkan & Metal) and enables general purpose GPU computation for AI/ML 🐎 Seamless Reanimated integration 🧊 Bringing stunning 3d experiences to React Native using ThreeJS and React Three Fiber

Mustafa Ali

262,567 views • 1 year ago

Still one of my fav projects I worked on in the day job – an interactive experience showing low-carbon technology for the home Custom 3D models created in Blender 🔶 and everything is rendered in the browser using Three.js and the awesome react-three-fiber
0:18

Still one of my fav projects I worked on in the day job – an interactive experience showing low-carbon technology for the home Custom 3D models created in Blender 🔶 and everything is rendered in the browser using Three.js and the awesome react-three-fiber

Robin Hawkes

26,525 views • 3 years ago

Learn how LLMs work under the hood! This is the best interactive website to learn how LLMs work. It combines clear, step-by-step explanations with dynamic 3D visualizations for an intuitive learning experience.
0:12

Learn how LLMs work under the hood! This is the best interactive website to learn how LLMs work. It combines clear, step-by-step explanations with dynamic 3D visualizations for an intuitive learning experience.

Sumanth

113,009 views • 1 year ago

New Astro + View Transitions demo ✨ This time using React Three Fiber to render an animated 3D model that persists across page-navigations.
0:18

New Astro + View Transitions demo ✨ This time using React Three Fiber to render an animated 3D model that persists across page-navigations.

Maxi Ferreira

125,776 views • 2 years ago

Vercel Domains just got a full rebuild: • Search without logging in • Instant, streaming search results • At-cost pricing (up to 50% lower) • Private search, with no logging • Support for 500+ TLDs • Multi-domain checkout Try it now at
0:14

Vercel Domains just got a full rebuild: • Search without logging in • Instant, streaming search results • At-cost pricing (up to 50% lower) • Private search, with no logging • Support for 500+ TLDs • Multi-domain checkout Try it now at

Vercel

923,565 views • 8 months ago

Transparent Globe Project- It’s finally complete! 10 unique interactive 3D globes, each visualizing a completely different global dataset in real time. From river flows and seismic activity to population density, global inequality, satellite constellations, and even Sonic Nomad roaming the planet with live music. Every globe is transparent, responsive, and built from scratch to feel alive. #CreativeCoding Three.js React-three-fiber #DataVisualization #WebGL #GenerativeArt #BuildInPublic
0:17

Transparent Globe Project- It’s finally complete! 10 unique interactive 3D globes, each visualizing a completely different global dataset in real time. From river flows and seismic activity to population density, global inequality, satellite constellations, and even Sonic Nomad roaming the planet with live music. Every globe is transparent, responsive, and built from scratch to feel alive. #CreativeCoding Three.js React-three-fiber #DataVisualization #WebGL #GenerativeArt #BuildInPublic

SHAHNAB AHMED

37,611 views • 2 months ago

Claude Sonnet 4.5 is now live on Vercel AI Cloud: • Improved v0, Vercel Agent, and more • Available on AI Gateway + AI SDK • New open source Coding Agent Platform
0:10

Claude Sonnet 4.5 is now live on Vercel AI Cloud: • Improved v0, Vercel Agent, and more • Available on AI Gateway + AI SDK • New open source Coding Agent Platform

Vercel

175,414 views • 8 months ago

Start your 3D engines 🏎️ Learn how to build a 3D racing experience in less than an hour in Unity Studio, our web-based editor designed for industries like manufacturing, automotive, healthcare, architecture, and more. Join us live on June 3, 2026, at 9:00 AM PDT / 12:00 PM EDT to follow along step-by-step with Unity experts as we take pre-built assets and turn them into an interactive racing environment. You’ll learn how to: 🏎️ Build and customize interactive 3D scenes 💡 Add lighting, materials, and interactions quickly 🛠️ Assemble and iterate using Studio workflows 🎉 Publish and share your experience Register here:
0:15

Start your 3D engines 🏎️ Learn how to build a 3D racing experience in less than an hour in Unity Studio, our web-based editor designed for industries like manufacturing, automotive, healthcare, architecture, and more. Join us live on June 3, 2026, at 9:00 AM PDT / 12:00 PM EDT to follow along step-by-step with Unity experts as we take pre-built assets and turn them into an interactive racing environment. You’ll learn how to: 🏎️ Build and customize interactive 3D scenes 💡 Add lighting, materials, and interactions quickly 🛠️ Assemble and iterate using Studio workflows 🎉 Publish and share your experience Register here:

Unity

34,004 views • 21 days ago

✧ Vercel Navbar Made with Tailwind and Motion React.
0:17

✧ Vercel Navbar Made with Tailwind and Motion React.

LN

43,097 views • 1 year ago

This is such a cool interactive website to learn how LLMs work. It’s combines step-by-step text explanations with dynamic 3D visualizations for an immersive learning experience. Available to everyone for free!
0:12

This is such a cool interactive website to learn how LLMs work. It’s combines step-by-step text explanations with dynamic 3D visualizations for an immersive learning experience. Available to everyone for free!

Alvaro Cintas

305,363 views • 1 year ago

When we say “ship it”, we mean it. Our Day Zero Stack is back with a new wave of partners and more exclusive discounts on the tools founders love most. Ship faster, hire smarter, and build with AI from day one with our partners deel, Drata, Granola, Linear, Gabriella Warp, Wispr Flow, Attio, and Vercel
0:19

When we say “ship it”, we mean it. Our Day Zero Stack is back with a new wave of partners and more exclusive discounts on the tools founders love most. Ship faster, hire smarter, and build with AI from day one with our partners deel, Drata, Granola, Linear, Gabriella Warp, Wispr Flow, Attio, and Vercel

Brex

37,566 views • 4 months ago