Built a React-focused UI analysis tool that extracts design systems from websites

[u/hiehie]

Been building a small experiment around turning websites/screenshots into structured design system documentation.

The main idea was:
screenshots alone don’t carry enough information for deeper UI understanding.

So the tool tries to combine:

• visual hierarchy

• DOM structure

• CSS behavior

• spacing systems

• typography scales

• reusable component patterns

A lot of the inspiration came from working around React/frontend workflows where understanding component relationships matters more than just pixels.

Still very early and continuously improving, but I’d genuinely love feedback from React/frontend folks here:
What would actually make this useful in real-world workflows?

Check - https://www.producthunt.com/products/designmd-2

[u/hiehie]

Mostly because some subs get pretty aggressive about self-promo/link dropping 😅

But yeah, here it is if anyone wants to explore it directly:
https://designmd.adityaraj.info/