PickCells

Procedurally generate pixel art in your browser.

Why?

Maybe you

• are in a game jam and need some quick and dirty variations on the same sprite;
• have something in mind, but that's not quite it and you need to give it a spin;
• just want to goof around and see if something useful comes up

How?

Click here.

You will be presented a grid you can fill using the tools in the sidebar. Here you can find more information.

Examples

If you don't want to start from scratch, you can get starte with one of the examples.

Sharing an example

1. Download your example using the button in the sidebar
2. Fork this project
3. Add the downloaded example in the /public/examples folder
4. Add the filename to the examples list here
5. Open a Pull Request

Contributing

Contributions are very welcome! Here's a quick intro to the project.

It is a vanilla TypeScript project built with Vite. The only included sophistication is PostCSS plugin to handle nesting in CSS.

All the business logic aroung creating masks and sprites is in the src/lib folder.

All the UI code is in the src/ui folder, which is very dumb right now: most of the templating relies on strings, and the state is just a glorified Proxy.

If you want to contribute icons or graphics, please consider using PickCells itself as we did for the icons so far.