Open Source TypeScript 3D Modeling Software

Modly is a lightweight platform designed to simplify the creation and management of modular AI-driven workflows and tools. It focuses on breaking down complex processes into reusable modules that can be combined and orchestrated to achieve specific goals. The system emphasizes flexibility, allowing users to define custom modules and integrate them into larger pipelines. It supports experimentation, enabling users to test and refine workflows quickly. Modly is designed to be accessible, with a minimal setup process that allows users to get started without significant overhead. It is particularly useful for developers building AI-powered systems that require modular and scalable architecture. Overall, Modly provides a structured approach to managing AI workflows through modular design principles.

SuperSplat is a free and open source tool for inspecting and editing 3D Gaussian Splats. It is built on web technologies and runs in the browser, so there's nothing to download or install.

fSpy is a free, open-source camera matching application that calculates 3D camera parameters from still photographs. It helps artists align virtual cameras with the perspective of real-world images for accurate 3D modeling and compositing. Users define perspective reference lines to estimate camera orientation, position, and field of view. The application also provides controls for adjusting the principal point and reference measurements. Calculated camera parameters can be transferred to Blender using an official importer add-on. Other 3D applications can use the parameters through manual configuration or custom importers. Built with Electron and TypeScript, fSpy runs on Windows, macOS, and Linux.

Human Atlas is an open-source interactive 3D anatomy explorer built with React and Three.js. It visualizes the BodyParts3D adult male reference as 2,234 individually selectable anatomical meshes. Users can rotate, zoom, select, isolate, and inspect structures directly in the browser. Fifteen anatomical systems can be toggled independently or viewed through presets such as skeleton and organs. Search covers thousands of named concepts and source identifiers for quickly locating structures. An exploded-view mode separates visible anatomy into a spatial inventory while preserving interactive selection. The interface is responsive for desktop and mobile use and requires no account or API key to run locally.

Editor is a lightweight, browser-based code editing environment designed to provide a fast and minimal interface for writing and testing code directly in the browser. The project focuses on simplicity and performance, offering a distraction-free workspace that allows developers to quickly prototype ideas without the overhead of a full development environment. It leverages modern web technologies to deliver a responsive and interactive experience, making it suitable for quick experiments, demos, or educational purposes. The editor emphasizes ease of use, allowing users to write, edit, and preview code in real time with minimal configuration. Its architecture is intentionally simple, making it easy to extend or customize for specific use cases such as embedded editors or teaching tools. The project is particularly useful for developers who want a portable and accessible coding environment that works across devices without installation.

I wanted to code something similar to react-three-fiber but for VueJS. I started from scratch, I will rewrite some of my WebGL demos to see if this little toy can do the job. The most popular WebGL library, with a good support on both desktop and mobile. With TroisJS you can easily create 3D content for your website using VueJS components. Really fast development time with ViteJS/HMR ! Useful to create awesome 3D scenes. Thanks to VueJS/ViteJS, TroisJS use watchers and HMR to update ThreeJS objects when you update a template or a prop. This means the result in your browser will be automatically updated without reloading all the stuff. This is really helpful when you are creating a TroisJS Scene. Most of the props are reactive, please take a look at components source to see exactly which ones.

Placing content in THREE.js is hard. @react-three/flex brings the webs flexbox spec to react-three-fiber. It is based on Yoga, Facebook's open-source layout engine for react-native. Simply create layouts by wrapping your 3D objects in different <Box /> instances inside a <Flex /> container. This way they will be automatically placed in the 3D space following the flexbox specification just like in the DOM. You can tweak the container and the boxes using standard CSS flex properties, like flexDirection or justifyContent for the container and flexGrow for the boxes. There are also shorthands, like align and justify. When positioning items, react-three-flex needs to know where the object anchor is: Yoga Layout expects the object position to be relative to the upper left corner, which is the same as the DOM expects.