Browse your Figma design system and audit file adoption

By General Input

See every published component and style in your team library, then check any design file for how much of it actually gets used.

Integrations

  • Figma
  • Linear

Type

App

Categories

  • Product
  • Engineering

I want an app that turns our Figma team library into a browsable design system console, so I can finally answer two questions: what is in our library, and is anyone actually using it. It reads everything from Figma, and it can file follow-up work into Linear.

Setup: on first run the app asks me to paste my Figma team URL (the https://www.figma.com/files/team/{team_id}/... link). Parse the team id out of that URL and store it, because team IDs cannot be discovered through the Figma API at all. Let me edit it later in a settings area and save more than one team.

Main view, the library catalog: a searchable, filterable grid of everything published in the team library, loaded with Get Team Components, Get Team Component Sets, and Get Team Styles. All three paginate with opaque integer cursors returned as meta.cursor.after, so page through until the cursor runs out and cache the results server side rather than refetching on every keystroke, with a Refresh button to re-pull. Each card shows a rendered thumbnail, the name, the description, the library file it lives in, and when it was last updated. Thumbnails come from Render Images of File Nodes against the containing file key and node id. Those render URLs expire after 30 days, so fetch them lazily when a card scrolls into view instead of storing them, and batch the node ids for a single file into one render call. Filters: by library file, by type (component, component set, style), by style type (fill, text, effect, grid), and free text across name and description. Visually flag items that have no description, since those are the ones nobody knows how to use.

Detail page per catalog item: clicking a card opens a page that calls Get Component, Get Component Set, or Get Style by key for the full metadata (name, description, containing page and frame, created and updated dates, who published it), shows a larger render, and for a component set lists its variant components underneath. Include a copyable deep link back to the node in Figma, remembering that node IDs use colons in the API but hyphens in file URLs, so convert when building links.

Second view, adoption: a list of the consuming design files I care about. I add a file by pasting its URL, the app extracts the file key and remembers the list. Each row shows the file name and last modified date from Get File Metadata plus an adoption scorecard computed by walking the document tree. Pull the tree with Get File, and use Get File Nodes for targeted sub-trees when a file is too large for one call, then count instances whose component key maps to a published component or component set from the catalog versus local components and detached frames, and count fills and text nodes bound to a published style key versus raw hex values and one-off text settings. Show library coverage as a percentage alongside the raw counts, and a breakdown of the worst pages in the file. Get File is the most rate-limit-expensive call in the API, so cache each scorecard with a computed-at timestamp, recompute on demand, and back off politely on 429 responses.

Every file row has an Audit this file button that kicks off a background agent. The agent walks the document tree (Get File, plus Get File Nodes for deep sub-trees), diffs it against the published component and style keys from the catalog, groups the violations into themes such as detached instances, off-system color, one-off text styles, and near-miss components where a library equivalent already exists, then writes a plain-language findings report back into the app so it appears on that file's detail page. The report should read like something I could forward to a product designer: a short summary, the themes ordered by how many layers they touch, and named examples with deep links to the offending frames. Keep past reports so I can compare a file over time.

From a finished report I can file one Linear issue per violation cluster using Create Issue. The title names the theme and the file, the description carries the plain-language explanation, the counts, and the deep links to the offending frames in hyphenated node-id form, and I choose the destination Linear team once in settings using List Teams. Store the created issue id and URL back on the cluster so the app shows which clusters are already filed and never double-files the same one.

Important nuance about plans: Figma's Library Analytics endpoints (Get Library Analytics Component Usage, Component Actions, Style Usage, Style Actions) are Enterprise only. So every number in this app must be derived from the document tree by default, and analytics should only be layered on as enrichment where the plan allows: if those calls succeed, add insertion and detachment counts to the catalog cards and adoption rows and label them as coming from Figma analytics. If they return 403, hide those columns quietly rather than showing an error.

Everything the app does against Figma is read only. The audience is design system leads, design managers, and design ops people who do not know anything about APIs, so the setup should be nothing more than pasting a team URL and a few file URLs. Remember per user: the saved team, the tracked file list, audit report history, and the Linear destination.

Related prompts

Explore more prompts
Catch feature flags that never got switched on in productionWeekly alert noise review board for incident.io on-callMorning triage board for your Kernel browser agent runsTrack every half finished LaunchDarkly rollout in one boardFind the customers stuck contacting support again and againTurn shipped Linear work into Intercom product announcementsVoice agent QA review board for your Hume EVI callsClose the loop between Front tickets and Linear bug fixesOpen a Heroku release war room the moment production looks wrongFind the themes Help Scout tags miss and file them in Linear