Skip to content

Your design system, in the wild.

UhScan is an adoption and usage tool for your design system. It scans the repos your teams ship and shows what’s adopted, what’s drifting, and what should have been retired.

Works with

  • React
  • Next.js
  • Vue
  • Svelte
  • Solid
  • Astro
  • Angular
  • Lit
  • Web Components

Not knowing is the expensive part

A design system costs money in the places you can’t see: audits done by hand, migrations that stall, components kept alive for no one. A scan makes those visible.

  • −audits

    Stop paying engineers to grep

    “Where is this used?” takes one scan, across every repo, and the answer stays current.

  • −deprecations

    Plan a migration once

    See every remaining usage before you remove a component, so the work is scoped up front and not found in production.

  • −upkeep

    Stop maintaining what nobody uses

    Components with zero usages show up as exactly that. Retire them and drop the docs, tests and reviews they cost.

  • −runtime

    Nothing to run in production

    It reads source code. There is no SDK in your bundle and no bill that grows with traffic.

By hand, per year

estimate

12

times someone asks where a component is used

8

searching repos and checking results by hand

$90

what an engineer’s hour costs you, in dollars

12 × 8 h96 hours
Total$8,640
With a scanone command

Your numbers, your arithmetic. The starting values are placeholders, not benchmarks.

Every screen, from real scan data

Adoption, frameworks, deprecations and recent scans at a glance.

acme · 30d

Adoption, frameworks, deprecations and recent scans at a glance.

Trace any component from repo to render

Every scan draws a graph of your repos, the files in them, the components they render and the packages those come from. This is the real graph view on sample data: pick a layout and click around.

Pan and zoom the whole graph: every repo, file, component and package.

AAcme/Dependency graphLive · sample data

Everything your design system team asks about, answered from real code

  • --usage

    Component usage

    Your library’s components and your own, counted per component, repo and framework.

  • --trend

    Adoption over time

    Each scan is a snapshot, so trends build themselves.

  • --graph

    Dependency graph

    Follow a component from repo to file to render.

  • --deprecated

    Deprecation tracking

    Reads @deprecated JSDoc, then shows where old components still live.

  • --props

    Props & variants

    See which variants teams actually reach for.

  • --pages

    Page inventory

    Every route, and the components each page renders.

  • --ci

    Runs in CI

    Drop in the GitHub Action and every push to main uploads a fresh scan.

  • --org

    Orgs & tokens

    One upload token per org. Super admins manage orgs and members.

Three steps to a full picture: no SDK, no runtime cost

  1. Step 1: Point it at your design system

    Add one small config file to the repo you want to measure. The scanner is a dev tool: it never ships with your app.

    uhscan.config.json
    {
      "packageName": "@acme/design-system",
      "importSources": ["@acme/design-system"],
      "repo": { "name": "marketing-site" }
    }
  2. Step 2: Scan locally or in CI

    The CLI parses every file, counts your components and uploads the scan with an org token. Run it by hand or on every push.

    • On your machineuhscan scan --upload
    • In CIevery push to main
    components
    15
    usages
    902
    repos
    6
  3. Step 3: See adoption everywhere

    Usage per component, trends over time, prop values, deprecations and the dependency graph, per repo and framework.

    Top components

    • Button154
    • Card118
    • Input106
    • Tooltip83
    • PageHeader81
  4. What it adds to your app

    0 KB

    The scanner reads your source files; nothing ships to your users.

One command, and the whole codebase reports in

The CLI reads every file with each framework’s own compiler, counts every design-system component, and says what it couldn’t read instead of guessing.

~/acme/marketing-site
❯ uhscan scan --upload
→ uhscan.config.json  @acme/design-system→ framework nextjs · 214 files · 0 skipped→ 15 components · 902 usages · 6 repos→ most used Button (154)⚠ LegacyModal still used 1× (@deprecated)✓ uploaded to acme · scan #482

See where your components really live.