Variant Selector

About this plugin

Component Set Selector is a powerful Figma plugin designed to make working with complex component sets effortless. Whether you're managing a design system with hundreds of variants or need to quickly find and edit specific elements across multiple components, this plugin streamlines your workflow.

Key Capabilities:

1. Smart Variant Filtering: Use checkboxes to filter component variants by any combination of properties (size, state, type, etc.)
2. Layer-Level Precision: Go beyond variant selection—target specific layers (like "Icon" or "Label") within filtered variants
3. Auto-Detection: Automatically detects when you select a component set, no manual refresh needed
4. Intelligent Autocomplete: Type-ahead suggestions help you quickly find layer names
5. Batch Operations: Perfect for batch editing, style updates, and consistency checks across your design system

Perfect For:

1. Design system maintainers managing large component libraries
2. Designers who need to quickly find and edit specific variants
3. Teams performing consistency audits across components
4. Anyone working with complex component sets with multiple properties

Features

- Load properties from a selected component set

1. Auto-detection: Automatically reloads when you select a different component set
2. Collapsible properties: Click to expand/collapse each property section
3. Layer selection: Target specific layers within variants (optional)
4. Filter variants using checkboxes for each property value
5. Select multiple property values to find matching variants
6. Automatically selects matching variants or specific layers in the Figma canvas
7. Autocomplete suggestions for layer names
8. Works with component sets of any complexity
9. Shows property value count badges

How to Use

1. Run the Plugin from the Plugins menu

2. Select a Component Se in your Figma file (before or after opening the plugin)

1. The plugin automatically detects when you select a component set
2. You can switch between different component sets while the plugin is open

3.(Optional) Specify Target Layer - Enter a layer name in the "Target Layer" field

1. Leave empty to select entire variants (default behavior)
2. Enter a layer name to select only that layer within matching variants
3. Autocomplete suggestions appear as you type
4. Example: Enter "Icon" to select all icon layers within filtered variants

4. View the Properties - The plugin will display all properties as collapsible sections

1. Click on any property header to expand/collapse it
2. The first property is expanded by default
3. Each property shows a badge with the number of values

5. Select Property Values- Check the boxes for the property values you want to filter by

1. You can select multiple values for each property
2. Variants must match ALL selected properties (AND logic)
3. Leave all unchecked to match all variants

6. Click "Select Variants" - The plugin will select matching items in the canvas

1. If no layer specified: Selects all matching variants
2. If layer specified: Selects that layer from all matching variants

7. The selected items will be highlighted and the viewport will zoom to show them