https://github.com/michioxd/genbokeh
A modern web application that generates beautiful bokeh wallpapers using HTML5 Canvas and Web Workers. Built with TypeScript, Vite, and dat.GUI
https://github.com/michioxd/genbokeh
bokeh canvas datgui generator typescript vite wallpaper
Last synced: about 2 months ago
JSON representation
A modern web application that generates beautiful bokeh wallpapers using HTML5 Canvas and Web Workers. Built with TypeScript, Vite, and dat.GUI
- Host: GitHub
- URL: https://github.com/michioxd/genbokeh
- Owner: michioxd
- License: mit
- Created: 2025-06-08T15:05:24.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-08T16:05:59.000Z (about 1 year ago)
- Last Synced: 2025-06-24T15:56:14.753Z (12 months ago)
- Topics: bokeh, canvas, datgui, generator, typescript, vite, wallpaper
- Language: TypeScript
- Homepage: http://genbokeh.michioxd.ch/
- Size: 1.54 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# genbokeh
A modern web application that generates beautiful bokeh wallpapers using HTML5 Canvas and Web Workers. Built with TypeScript, Vite, and dat.GUI.
## Features
- 🎨 Real-time bokeh effect generation
- ⚡ Web Worker support for better performance
- 🎯 Multiple shape options (Circle, Polygon, Star, Hearts)
- 🌈 Customizable colors and effects
- 📱 Responsive design
- 💾 Save generated images
- ⚙️ Extensive customization options
- ⏱️ Performance metrics
## Customization Options
### Image Settings
- Width and Height
- Image format (PNG, JPEG, WEBP)
### Bokeh Properties
- Shape type (Circle, Polygon, Star, Hearts)
- Number of vertices
- Maximum size
- Blur effect
- Stroke options
- Rotation settings
- Particle count
### Color Settings
- Hue
- Saturation
- Lightness
- Alpha
- Random hue options
- None
- Rainbow
- Random in range
## Performance
The application uses Web Workers to offload the heavy computation of bokeh generation to a separate thread, ensuring smooth UI performance. If Web Workers are not supported, it gracefully falls back to main thread processing.
## Development
### Prerequisites
- Bun (latest is recommend)
### Setup
1. Clone the repository:
```bash
git clone https://github.com/michioxd/genbokeh.git
cd genbokeh
```
2. Install dependencies:
```bash
bun i
```
3. Start the development server:
```bash
bun dev
```
4. Build for production:
```bash
bun build
```
## Technologies Used
- TypeScript
- Vite
- dat.GUI
- HTML5 Canvas
- Web Workers
- SCSS
## License
MIT License - see the [LICENSE](LICENSE) file for details.
## Author
Created by [michioxd](https://github.com/michioxd)
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.