https://github.com/zabastx/mixeur
Blender-like web-based 3D editor built with Vue.js and Three.js
https://github.com/zabastx/mixeur
3d-editor threejs vuejs
Last synced: 3 months ago
JSON representation
Blender-like web-based 3D editor built with Vue.js and Three.js
- Host: GitHub
- URL: https://github.com/zabastx/mixeur
- Owner: zabastx
- License: mit
- Created: 2025-07-29T09:09:11.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2026-04-22T08:21:49.000Z (3 months ago)
- Last Synced: 2026-04-22T08:35:58.827Z (3 months ago)
- Topics: 3d-editor, threejs, vuejs
- Language: Vue
- Homepage: https://mixeur.zabastx.ru/
- Size: 58.2 MB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Agents: AGENTS.md
Awesome Lists containing this project
README
# Mixeur
[](https://opensource.org/licenses/MIT)
[](https://vuejs.org/)
[](https://threejs.org/)
A Blender-like web-based 3D editor built with Vue.js and Three.js. Mixeur provides an interface for 3D modeling, object manipulation, and scene management directly in the browser.
## Demo
Try the live demo at [mixeur.zabastx.ru](https://mixeur.zabastx.ru)
## Features
### Object Manipulation
- **Selection & Transformation**: Click to select objects with transform gizmos (move, rotate, scale)
- **BVH Acceleration**: Fast raycasting and collision detection using Bounding Volume Hierarchy
- **Blender-style Controls**: Familiar navigation with viewport gizmo for orientation
- **Properties Panel**: Edit transforms, geometry parameters, materials, lights, and camera properties
### Shading & Rendering
- **Viewport Shading Modes**: Wireframe, solid (flat grey), material preview (with HDRI), and rendered views
- **HDR Environment Maps**: 8 built-in environments (city, courtyard, forest, interior, night, studio, sunrise, sunset)
- **Image Rendering**: Export scenes to PNG, JPEG, or WebP with custom resolution and optional transparent background
### Content Creation
- **Primitive Meshes**: Planes, cubes, circles, spheres, icospheres, cylinders, cones, and torus shapes with parameter editing
- **Text Objects**: 3D text with 6 built-in fonts, customizable size, depth, and material
- **Lighting System**: Point, directional, spot, and rectarea lights with color, intensity, distance, and shadow settings
- **Material Editor**: Six material types (Physical, Standard, Phong, Toon, Lambert, Normal) with real-time property editing
### Asset Management
- **Model Import**: GLTF/GLB (with Draco and KTX2 support), OBJ (with MTL), and FBX formats
- **Model Export**: Export scenes to GLB format excluding helper objects
- **Models Library**: Browse and import free CC0 3D models from Poly Haven with category filtering and resolution selection
- **Texture Library**: Import textures by type (AO, diffuse, normal, roughness, etc.) for material assignment
### Scene Management
- **Outliner Panel**: Hierarchical tree view with visibility toggles and group detection
- **Properties Panel**: Edit transforms, geometry parameters, materials, lights, and camera properties
## Tech Stack
- **Frontend**: Vue 3 with Composition API
- **3D Engine**: Three.js with BVH acceleration for fast raycasting
- **State Management**: Pinia 3
- **Styling**: Tailwind CSS v4
- **Build Tool**: Vite 8
- **TypeScript**: Full type safety
- **UI Components**: Reka UI
- **Icons**: Custom SVG icon system
- **Testing**: Vitest (unit), Playwright (E2E)
## Core Dependencies
- `three`: 3D graphics library
- `three-mesh-bvh`: Bounding Volume Hierarchy for fast raycasting
- `three-viewport-gizmo`: Camera navigation gizmo
- `vue`: Progressive JavaScript framework
- `pinia`: State management for Vue 3
- `@vueuse/core`: Collection of Vue composition utilities
- `@jaames/iro`: Color picker library
- `reka-ui`: Vue component primitives
## Acknowledgments
- [Three.js](https://threejs.org/) - 3D graphics library
- [Vue.js](https://vuejs.org/) - Progressive JavaScript framework
- [Blender](https://www.blender.org/) - Inspiration for UI/UX patterns
- [Poly Haven](https://polyhaven.com/) - Free CC0 3D models, HDRIs, and textures
- [three-mesh-bvh](https://github.com/gkjohnson/three-mesh-bvh) - BVH acceleration
- [three-viewport-gizmo](https://github.com/JamesLMilner/three-viewport-gizmo) - Camera gizmo
- [ui.blender.org/icons](https://ui.blender.org/icons) - Blender Icons
## License
MIT License - Copyright (c) 2026 Danil Popov
See [LICENSE](LICENSE) for more details.