---
title: "UI-Anatomist"
description: "Chrome extension that scans a rendered web UI's observable styles, states and icons, plus a Figma plugin that rebuilds them as editable variables and components."
canonical: "https://vibing.inc/library/ui-anatomist-vg-2145"
category: "Design Tools & Generators"
subcategory: "Design tokens"
license: "Apache-2.0"
author: "Su JiaYi (@SuJiaYi27)"
source: "https://github.com/SuJiaYi27/UI-Anatomist"
---

# UI-Anatomist
Chrome extension that scans a rendered web UI's observable styles, states and icons, plus a Figma plugin that rebuilds them as editable variables and components.
## Facts
- Source: https://github.com/SuJiaYi27/UI-Anatomist
- Category: Design Tools & Generators / Design tokens
- Author: Su JiaYi (@SuJiaYi27)
- Licence: Apache-2.0
- Tags: figma, design-tokens, chrome-extension, design-system
## Why it's a gem
Turns any live page into real Figma variables and components, no backend or API key.
---
Listed in The Vibeary: https://vibing.inc/library/ui-anatomist-vg-2145 · JSON: https://vibing.inc/api/public/library/gems/ui-anatomist-vg-2145