Fixing a design decision after it ships costs roughly 100x more than
catching it at the mockup stage. That ratio comes from Boehm (1981)
and has been replicated since. The problem is not that teams ignore
design quality, it's that nothing blocks a merge when the design is
already over budget.
Figcap is a GitHub Action. You add a Figma URL to your PR description.
Figcap fetches the file, runs three checks, and exits with code 1 if
any rule fails. GitHub blocks the merge and posts a comment listing
each violation.
- uses: Adri2-2/figcap@v1
with:
figma-token: ${{ secrets.FIGMA_TOKEN }}
That's the full setup. No config file required. All thresholds have
defaults and can be overridden via inputs.
Three rules ship by default.
Font pairs (max 3). Each font family and weight combination is a
separate network request. On a median mobile connection, each one adds
150 to 400ms of render-blocking latency. Three pairs is enough for
most design systems.
Frame nesting depth (max 8). Deep Figma frames produce deep DOM
structures on export. Layout and Paint costs grow non-linearly past
a certain depth. Eight levels covers real-world complexity without
creating friction.
Bitmap weight (max 500 KB estimated). The check measures estimated
transfer cost, not asset count. One 2 MB image fails. Twenty 20 KB
icons pass. Network cost is the unit, not the number of files.
Repo: https://github.com/Adri2-2/figcap
GitHub Marketplace: https://github.com/marketplace/actions/figcap-figma-design-budget-linter
Top comments (0)