A powerful Figma plugin that exports images optimized for Roblox with chipng-like processing to prevent pixel artifacts and edge bleeding. Select any layer in Figma and export it with professional Roblox optimization at multiple scales.
- Download the plugin files:
manifest.json,code.js,ui.html - Install in Figma: Go to
Plugins→Development→Import plugin from manifest... - Select layers in your Figma file
- Export with optimization at 1x, 2x, or 4x scale
👉 See detailed installation guide →
- 🎯 Smart Layer Detection: Automatically detects exportable Figma layers
- 📏 Multiple Scales: Export at 1x, 2x, or 4x like Figma's native export
- 🛡️ Roblox Optimization:
- Adds transparent borders to prevent compression artifacts
- Extends edge pixels for smooth blending
- Optimizes alpha channels for Roblox's texture system
- ⚡ Batch Export: Export multiple selected layers at once
- 🔄 Real-time Preview: Shows selected items with dimensions
manifest.json- Plugin configurationcode.js- Main plugin logic and Figma API integrationui.html- Plugin interface with image processingREADME_PLUGIN.md- Complete plugin documentation
- Plugin Installation & Usage Guide - Complete guide for the Figma plugin
- ✅ Frames, Components, Instances
- ✅ Groups, Rectangles, Ellipses
- ✅ Polygons, Stars, Vectors
- ✅ Text layers (exported as images)
The plugin uses HTML5 Canvas for Roblox optimization:
- Border Addition: 2px transparent border
- Edge Extension: Extends edge pixels into border
- Alpha Optimization: Proper transparency handling
- Scale Preservation: Crisp edges at all scales
Exported files: {layer_name}_{scale}x_roblox.png