๐ Introducing Figma Sprite Generator โ Effortlessly Create PNG Sprites from Your Figma Icons
Omid Nikrah
Posted on October 14, 2024
Hey DEV community! ๐
I just released a Figma plugin called Figma Sprite Generator, and Iโd love to get your feedback! The tool is designed to help designers quickly generate PNG sprites from selected icons within Figma.
๐ฏ Key Features:
Easy-to-use interface: Select your icons and export them as a single PNG sprite with just a few clicks.
Customizable ratios: Resize icons to your desired scale with a simple ratio selection (e.g., 1.5x or 2x).
Automatic sprite.json generation: Along with the sprite image, youโll get a JSON file with all the icons' coordinates and dimensions for easy integration in your projects.
๐จ Why I Built This:
As a software engineer, Iโve worked closely with many designers who often struggle with creating spritesheet icons. Itโs a frustrating process for themโexporting all the icons from Figma, uploading them to a platform to generate the spritesheet, and then going through additional steps to get the final result. This manual approach is time-consuming and inefficient. Figma Sprite Generator automates the entire process, instantly creating sprites and generating metadata, simplifying the workflow for both designers and developers.
๐ ๏ธ How It Works:
Select the icons you want in Figma.
Choose the desired ratio for resizing.
Generate a PNG sprite and JSON metadata with the positions and sizes of each icon.
๐ Check it out:
You can find the project on GitHub: Figma Sprite Generator. Feel free to contribute, open issues, or suggest improvements!
Let me know what you think in the comments! ๐
Posted on October 14, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
October 14, 2024