https://github.com/alexerlandsson/3d-model-maker
Simple tool to create voxel models built with HTML and CSS. Built using Next.js and CSS Modules.
https://github.com/alexerlandsson/3d-model-maker
3d css css-modules cuboid nextjs pixelart voxel
Last synced: about 2 months ago
JSON representation
Simple tool to create voxel models built with HTML and CSS. Built using Next.js and CSS Modules.
- Host: GitHub
- URL: https://github.com/alexerlandsson/3d-model-maker
- Owner: alexerlandsson
- Created: 2025-04-07T19:44:39.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2026-04-15T09:52:33.000Z (2 months ago)
- Last Synced: 2026-04-15T11:35:43.602Z (2 months ago)
- Topics: 3d, css, css-modules, cuboid, nextjs, pixelart, voxel
- Language: TypeScript
- Homepage: https://maker.alexerlandsson.com
- Size: 1.46 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CSS Voxel Studio
Simple tool to create pixelated 3D models (voxels) in HTML and CSS based on two Pens I created on *CodePen*:
- [3D Model Maker (Core)](https://codepen.io/alexerlandsson/pen/bNGJWBR)
- [3D Model Maker (Crossy Road)](https://codepen.io/alexerlandsson/pen/pvoBPdK)
This version is an extension of the original idea, where you can create a voxel model by placing cuboids in a 3D space. The cuboids are rendered using CSS and can be moved around in 3D space.
## Screenshot
*Screenshot from an early stage. More features have been added.*
## Development
> [!NOTE]
> This project is a hobby and may or may not be maintained in the future.
### Run locally
This application is built using *Next.js*. To run it locally, run the following command.
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.