igma pen source Plugins
to help designers and developers work
faster, smarter and intentionally.
FigmaOP
to help designers and developers work
explore plugins
fast variants properties
Set variants properties fast and easy using toggles. No more writing each variant’s property over and over with every component in your design system. Now you can select from a pre-made list of properties the ones you want using toggles or add more by writing the property once.
layout handoff
Select frames or variants, run the plugin and in a blink of an eye, you will have 3 frames of each selection with borders around the children frames and variants. Each frame created is one nesting level deeper than the other. the 4th and the last frame (furthest to the right) will contain all the variants of components found in each selection. With the help of this plugin, the developer and the designer will have the ability to see clearly the layout of each frame and the variants of components that were used to build it. All that without extra effort.
icons toolbox
Set of tools to save you from redoing the same thing over and over again while designing or using your favorite icons. Tools: Save frame sizes and icons max-width preferences in a form of a button to have for future use. save as many preferences as you like and delete unused ones. Flatten multiple selected icons. Flatten all icons on a page. Duplicate multiple selected icons and rescale them to different sizes. All of the above with a press of a button!!! Last but not least, you have the option to preserve the stroke width in each resize or, you can let the plugin do the computations for you and change the weight according to the scaling ratio.
pages
Functions to simplify your pages problems: Select and delete multiple pages or choose to delete all of the pages in a file, Add multiple pages in one go, Save pages templates, Create pages index in a click. If you want to create a separator page e.g ------------- just type “-” as a page name. And if you want to add a separator with a name e.g ----cover---- just type “-cover-” as a page name. check
grid system
No more searching for the right grid to match your frame size!!! Functions to simplify your grids problems: Save grid templates with min and max sizes. Apply auto grids to frames -the plugin detects the frame’s sizes and applies the right grid that you saved as a template. Show all grids in selected frames with one click. Hide all grids in selected frames with one click. Delete and update templates.
auto layout reverse
Polyfill for auto-layout : A common problem with a simple solution! Run the plugin to add a reverse button to each auto-layout framecomponent in the current page. Great for creating bidirectional components for LTR and RTL languages, chat components, and more.
try me- (i can move)select sizes to duplicate
About & contribution
FigmaOp is a project dedicated to creating simple but effective tools to help with the day to day tasks of designers and developers.
one of the main goals of this project is to allow junior developers to give back to the community by building small scale application with open source in mind.
As we all know the best way to learn is to build and what is better than making something that people can actually use?!Do you want to help others and build awesome plugins?
Have an idea for something new but dont have the skills yet ?
