Variable Usage Finder

About this plugin

# Variable Usage Finder

Find where Figma variables (design tokens) are used across your components, variants, and pages with a single click.

## ✨ Key Features

**Smart Variable Search**

- Searchable dropdown with all project variables

- Support for all variable types: colors, numbers, strings, and booleans

- Instant autocomplete as you type

**Flexible Search Scope**

- Search across all pages in your file

- Search only in the current page

- Search within selected elements

**Detailed Results**

- See exact properties using each variable (fills, strokes, text, spacing, etc.)

- View full component hierarchy path

- Display variant information for component sets

- Show variable modes and their values

**High Performance**

- Optimized for large projects with 1000+ components

- Real-time progress tracking during search

- Smart caching for repeated searches

- Processes components in batches to keep Figma responsive

## 🎯 Perfect For

- Design system maintenance and audits

- Finding unused or rarely-used variables

- Understanding variable dependencies before making changes

- Documenting design token usage

- Cleaning up your variables library

## 📖 How to Use

1. Launch the plugin from the Figma menu

2. Select a variable from the searchable dropdown

3. Choose your search scope (All pages / Current page / Selection)

4. Click "Search" to find all usages

5. Click any result to jump directly to that component in your file

## 💡 Use Cases

- Before deleting a variable, check where it's used

- Audit which components use specific brand colors

- Find all text elements using a particular font size variable

- Identify components that need updating after variable changes

## 🔧 Technical Details

- Works with Figma's native variables API

- No external dependencies or data collection

- Processes everything locally in your Figma file

- Clean, minimal UI matching Figma's design language