7 ms·
Show HN: Mirrow – TypeScript DSL for animated SVGs with compile-time checks
Mirrow is a small TypeScript DSL that compiles to SVG. It aims to make SVG and animation simpler without JSX or hand rolled CSS.
Highlights:
- Compile time checks and attribute validation
- Inline events like on:click and @hover
- CLI to turn .mirrow files into static SVGs or use as components
Quick try: npx mirrow -i example.mirrow -o example.svg
Playground: [https://mirrow.app/playground https://mirrow.app/playground](https://mirrow.app/playground https://mirrow.app/playground)
GitHub: [https://github.com/MirrowApp/mirrow https://github.com/MirrowApp/mirrow](https://github.com/MirrowApp/mirrow https://github.com/MirrowApp/mirrow)
Feedback on DX, docs, and rough edges is very welcome. Thank you
- seppuku 1y agoThat is a really cool project, making SVG less of a pain to use. It looks much more readable and clean. The inline event feature with real time response shown on the playground is nice, good job!!
- era37 1y agoThanks so much for the encouraging words; I hope any devs who try it out will fix the pain points I have when writing my own SVGs. The project resonates from a love for SVGs so I hope any developers with that same love would be happy to follow along!