Building an Immersive 3D Dice Roller with React and Three.js

calendar_today agoschedule1 min read
— Originally published at dev.to

Hey RPG community! I wanted to share a tool I built for my tabletop sessions — Arcane-Dice.

Inspired by the immersive dice rolling experience in Baldur's Gate 3, I built this web-based 3D dice roller app to bring that same feeling to any browser.

Features:

  • Physics-based Rolling: Real 3D dice using Three.js and Cannon.js.
  • Immersive Effects: Sound effects and animations to make every roll feel impactful.
  • Easy Integration: Ready to be used in any web-based tabletop tool.

Tech Stack:

  • React
  • Three.js (React Three Fiber)
  • Cannon.js for physics
  • Howler.js for audio

Check it out on GitHub:
GitHub Repository
Live Demo

I'd love to hear your feedback or see what kind of dice skins you'd like to see next!

showdev #gamedev #threejs #react #rpg

🔥 Join developers growing publicly
Share your knowledge, build in public, and grow your developer presence with a global community.

More Posts

The Sovereign Vault — A Comprehensive Guide to Protocol-Driven AI

Ken W. Algerverified - Jun 4

Building HOLO.SYS — A Futuristic 3D Holographic Visualization System with React, Three.js & GLSL

YasirAwan4831 - May 8

React Native Quote Audit - USA

kajolshah - Mar 2

SolidJS 2.0 Async Data: A Deep Dive for React Devs

morellodev - Jul 16

How I Built a React Portfolio in 7 Days That Landed ₹1.2L in Freelance Work

Dharanidharan - Feb 9
chevron_left
168 Points3 Badges
3Posts
0Comments
I'm a Developer and an avid Gamer. I love exploring the intersection of Artificial Intelligence, Cyb... Show more

Related Jobs

View all jobs →

Commenters (This Week)

3 comments
3 comments
1 comment

Contribute meaningful comments to climb the leaderboard and earn badges!