Quickstart

Install LintKit and run your first scan in under a minute

Install the plugin

1. Open Figma

   Open the Figma desktop app or web app and open any design file.

2. Install LintKit

   Go to Plugins > Community, search for LintKit, and click Install.

   Or open the LintKit plugin listing directly.

3. Run the plugin

   Right-click the canvas, select Plugins > LintKit, or go to Plugins > LintKit > Open LintKit from the menu bar.

Understand the plugin layout

When LintKit opens, you see:

• Navigation tabs on the left — categories like Styles, Values, Components, Structure, Naming, and Accessibility. Click a tab to see findings for that category only.
• Overview at the top — shows a compliance dashboard with your file’s score, total findings, and handoff readiness.
• Findings list in the main area — each finding describes one inconsistency, grouped by rule. Click a finding to select the affected layers on the canvas.

The plugin adapts to your window size. Resize it wider to see the full navigation rail, or keep it narrow for a compact view.

Run your first scan

LintKit scans the current page automatically when it opens. You don’t need to click anything.

After the scan completes, you see:

1. A compliance score at the top — a percentage showing how clean your file is
2. Findings grouped by rule — for example, “Fills without styles (12 nodes)” or “Fractional pixels (3 nodes)”
3. Severity badges on each finding — error (red), warning (yellow), or info (blue)

LintKit scans the current page by default. Hidden and locked layers are skipped unless you enable them in configuration.

Scanning a selection

To scan only specific layers instead of the whole page:

1. Select one or more layers on the canvas
2. LintKit automatically re-scans your selection
3. Findings update to show only what’s relevant to the selected layers

Explore findings

Click any finding in the results list to:

1. Select the affected layers on the canvas — LintKit highlights them so you can see exactly where the problem is
2. Open the inspector — a detail panel showing the finding’s summary, affected node count, and available fixes
3. Navigate between nodes — if the finding affects multiple layers, click individual nodes in the inspector to jump between them

Use Shift+click to select multiple findings. This is useful for reviewing a group of related findings before deciding how to fix them.

Fix a finding

Once you’ve selected a finding, the inspector shows your fix options:

1. Review the suggested fix

   Most findings include a primary suggested fix. For example, an orphaned fill might suggest “Map to Primary/Blue” — the closest matching style in your file.

   Some findings offer multiple fix options. For example, an orphaned fill might let you map to a style, bind to a variable, or create a new style.

2. Choose the scope

   Apply the fix to:

   • This instance — fix just the selected node
   • All in this finding — fix every node grouped under this finding
3. Apply the fix

   Click the fix button. LintKit applies the change and removes the finding from the results.

   Every fix is a separate undo step in Figma. Press Ctrl+Z (or Cmd+Z on Mac) to undo immediately.

Fix confidence

Not all findings can be auto-fixed with equal safety. LintKit shows a confidence level:

Confidence	Meaning	Example
High (auto-fixable)	Safe to apply — changes a single property without side effects	Snapping padding from 7px to 8px in auto-layout
Medium (review suggested)	Likely correct but could affect layout	Changing element width or height
Low (manual fix)	LintKit can’t auto-fix safely — provides instructions instead	Adjusting gaps between layers in a freeform frame

Ignoring findings

If a finding is intentional (for example, a one-off spacing exception), click Ignore to dismiss it. Ignored findings:

• Persist across scans
• Can be scoped to the file (everyone sees it ignored) or just you (personal), depending on your configuration
• Can be shown as dimmed results if you enable Show ignored in results in settings

Configure for your team

The default settings work well for general use. For tighter enforcement, configure LintKit to match your design system:

1. Open settings

   Click the Settings tab in the plugin’s navigation.

2. Set your spacing scale

   If your team uses an 8px spacing grid, enter your allowed values (e.g., 0, 4, 8, 16, 24, 32, 48, 64) and enable the Spacing Scale rule.

3. Set your corner radii

   Enter the corner radius values your design system uses (e.g., 0, 4, 8, 16) and enable the Corner Radii rule.

4. Connect your tokens (optional)

   If your team uses Tokens Studio or stores tokens in GitHub, connect them in the Integrations section to auto-configure spacing, radii, and color rules. See Tokens Studio or GitHub for setup.

See Configuration for a full guide to every setting.

What’s next?

Browse all rules

See all 24 rules, what they check, and how to fix their findings.

Configure rules

Set up spacing scales, radii, color tolerances, and library governance.

Compliance dashboard

Understand your compliance score and handoff readiness.

Connect design tokens

Auto-configure rules from Tokens Studio or GitHub token files.