Companion

About this plugin

Advanced Color Finder [PRO Feature]

1. A powerful tool that allows you to search for colors across your files.
2. Ultra-fast search algorithm with advanced labeling
3. Colors are grouped by type (variable or style) and by source (Remote or local libraries)
4. Ability to search by variable name, color hex and by layer name
5. Display number of matching results per color
6. Select all or individual layers that matches the selected color

Style Guide Generator [Free]

1. Transform your color collections into a beautiful style guide
2. Choose one or more color formats to display (HEX, RGB, HSL)
3. Support for cross-collections linked variables

Contrast Checker [Free]

1. Check for AA and AAA level compliance
2. Interactive and instant results when adjusting colors
3. Live preview and swap foreground and background colors
4. Get results for for text (Small / Large) and graphics elements

Tints & Shades Generator [Free]

1. Interactive generator with live colors preview
2. Ability to customize the number of generated colors
3. Built-in contrast checker
4. Preview generated colors on canvas
5. Save generated colors to variables

Color Converter [Free]

1. Convert any given color to popular color formats
2. Currently supports HEX, RGB, HSL, CMYK, HSV, OKLCH and LAB
3. Select and copy results

―――――――――――――――――――――――――――――――――――

Sort Layers [Free]

A set of different ways to sort your layers within Figma.

1. Alphabetical sorting (A-Z or Z-A)
2. Sort by X or Y position on the canvas
3. Sort by layer type (Frame, text, group, section, etc…)
4. Reverse current sorting
5. Magically sort everything based on names and positions

Distribute Layers [Free]

A powered up version of Figma’s built-in distribute feature.

1. Distribute selected layers horizontally or vertically
2. Set a desired value for the space between layers
3. Ability to align layers from top (in horizontal mode) or left (in vertical mode)

Display As Grid [Free]

1. Quickly rearrange selected layers in a grid layout with improved alignment and sorting features
2. Ability to choose the number of columns along with vertical and horizontal gaps
3. Ability to align columns vertically or not
4. Extra sorting capabilities for better organization

Scale Layers [Free]

1. Scale one or more layers
2. Choose a specific width, height or percentage
3. Specify scaling direction

Hidden Layers [PRO Feature]

Simple yet powerful tool to bulk manage hidden layers. It allows you to

1. Hide selected layers
2. Show all hidden layers within a page or within a selection
3. Select all hidden layers within a page or within a selection
4. Delete all hidden layers within a page or within a selection

Locked Layers [Free]

Simple yet powerful tool to bulk manage locked layers. It allows you to

1. Lock or unlock selected layers
2. Lock or unlock all layers on a page

Remove Numbers [PRO Feature]

Get rid of all those annoying numbers that Figma automatically generates. A single click gets the job done

Ungroup Single Layers Group [PRO Feature]

Optimize your files by ungrouping single layers group or deleting empty groups

Start at 0, 0 [PRO Feature]

It’s just the cherry on top. A file is never tidy unless you start at 0, 0 — and for that, we got you covered

―――――――――――――――――――――――――――――――――――

Fix Detached Instances [PRO Feature]

1. Preview and fix all detached instances within your files.
2. Find all detached instances across pages
3. Preview of the original component versus the detached instance
4. Link instance to original component
5. Maintain all manual overrides

Find and Reset Instance Overrides [Free]

1. Scan your pages for instance overrides
2. Bulk select by override type (ex. reset all overriden strokes)
3. Basic and advanced mode for better control

Components Sitemap Generator [Free]

1. Generate a full sitemap of components in your file with number of variants, component description and documentation link

―――――――――――――――――――――――――――――――――――

Change Page Background [Free]

1. Easily change the current page background
2. Choose from available presets or set a custom color
3. Bulk apply to all pages in your file

Grid Calculator [Free]

1. Generate custom grids or use existing templates
2. Live preview of the grid
3. Add the grid to your file with a click

Clear Variable Modes [Free]

1. Clear all variable modes (ex: light / dark mode) applied to elements on the current or all pages or across all pages in the file

Count Frames [Free]

1. Count frames on current page or across the whole file
2. Specify frame width, height, visibility (optional)

―――――――――――――――――――――――――――――――――――

Deep Search [PRO Feature]

Unique and ultra-fast way to find any layer within your file. The algorithm has been thoroughly optimized for speed, especially for large files.

Below is how it works:

1. Start by selecting the layer type (Frame, text, rectangle, etc.) or choose “All Layers” to search everything
2. Choose one or more properties to search for (Fill color, width, font, etc.)
3. Hit the search button and voilà. Results are there.
4. Browse the list of matching search results, with ability to filter by layer name.
5. Click on a result to view it on the canvas or click “Select All” to bulk select all matching results

Here are some example scenarios:

1. [Simple] ― Find all text layers with the font “Inter” and font weight “Semi Bold”
2. [Simple] ― Find all rectangles with a corner radius of 16 and corner smoothing of 60%
3. [Medium] ― Find all instances of a component named “Button” that are hidden and have been detached
4. [Advanced] ― Find all instances of an external library component named “Input” that are marked as ready for dev and whose top left corner radius is less than or equal to 20px

In short, the possibilities are endless

―――――――――――――――――――――――――――――――――――

MagiConnect [PRO Feature]

MagiConnect is a simple and easy to use tool that allows you to draw connectors between your frames. Some key features include:

1. Auto-draw mode: When enabled, it allows you to quickly draw connectors between any two elements you select on the canvas. The direction of the connector arrow is based on the selection order
2. Manual mode was designed to give you more flexibility in accessing nested layers before drawing a connector. It’s slower for sure, but gives you more control
3. You can customize the connector by adjusting the color, opacity, stroke width, radius and stroke style
4. If you’re not happy with the connector customizations, you can always reset all values to their default state from the manage menu
5. You can also add an optional description to annotate the connector
6. The tool will always remember your last used settings whenever it’s launched the next time.
7. You can update specific connectors within a selection or update globally across a page
8. In cases where a fresh start is the way to go, simple go to “Manage” and select “Remove all connectors”. This will delete all connectors you’ve added on this page

―――――――――――――――――――――――――――――――――――

When you purchase the license, you will get a lifetime unlimited access to the plugin, and to all the upcoming features that will be added.

For any questions, ideas, bugs or complaints, I would love to hear from you.

Built with ❤️