I've always been fascinated by 2D and 3D CAD Software and WEB-CAD is my effort in Vanilla ES6 Javascript and HTML5 CANVAS API to make my own (...ultra ligth...) version.
For the 3D version check the repo my-web-cad-3d
- Lines, circles and rectangle and square shapes
- Select, move, copy, delete, resize and rotate operations on shapes
- Interpolated Animation for creating, moving and copying shapes
- Pan & Zoom System
- UNDO & REDO System
- "Snap to Grid" System (with 6 steps)
- Text and Measures
- Draggable Commands panel with Color palette
- Shortcut Keys
- Import and export drawings in .json format
- Grey/White/Blue themes
- Multiple Unit System (simple switch among units, tens and hundreds)
| s | Keys |
|---|---|
| Select | ESC / s |
| Copy | c |
| Move | m |
| Delete | d |
| Pan | p |
| Zoom | x (alt +/- to zoom in/out 10%, ctrl + x to restore the zero zoom level) |
| Rotate | w |
| Edit (scale, resize) | e |
| Line | l |
| Rectangle | r |
| Circle | a |
| Undo | ctrl + z |
| Redo | ctrl + y |
| Text | t |
| Measure | f |
- Multiple selection
- Layers
- Groups and Explode commands
- Blocks
check the app online or test things locally by just installing dependancies with npm iand running the local development environment with npm start. SVG Icons courtesy from materialdesignicons.com.
- Uhm, please let me know...!
This project is licensed under the ISC License.