01 / SYSTEM VISIBILITY↗
See the whole system.
Discover components, dependencies and usage paths that are usually buried across the repo.
Introducing a new perspective on UI systems ↗
Your UI system,
decoded.
Turn the frontend you already have into a living map of components, layouts and design decisions — one visual language for your team and AI coding agents.
Code-first by designNo Figma dependencyLocal-first direction
FROM THIS
</> Your frontend
scan · map · understand
TO THIS
◈ Your UI system
FOR EVERYONE
↗ Humans + agents
01 / THE EXPERIENCE
Meet your codebase.
Meet your codebase.
Like never before.
Browse your UI as a system, not a pile of files. Try this small, interactive concept of the CompoLens explorer.
Button component.button
◉ Canonical example
BUTTON / PRIMARY
Default · Medium · Primary
✳ This is a design prototype showing an intended experience, not a connected scanner or working product.
02 / THE POSSIBILITIESMore context.
More context.
Less guesswork.
Give your UI architecture a shape everyone can explore, understand and reuse.
02 / LAYOUT INTELLIGENCE↗
Layouts that mean something.
Describe layout structure, slots and responsive behavior as reusable, named building blocks.
03 / SHARED CONTEXT↗
One language. Two worlds.
Let humans and coding agents reference the same components, layouts and design rules.
03 / THE DIRECTION
One source of UI truth.
A proposed code-native workflow designed to keep your system understandable as it evolves.
01</>
Read the code
Inspect the real frontend project, its components, styles, routes and relationships.
02◇
Build the UI model
Connect visual primitives, semantic layouts, tokens and usage into one coherent map.
03↗
Explore and reuse
Navigate the UI Book, inspect rules and give coding agents precise shared context.
Research-led, not feature-led.
Explore concept ↗CompoLens is currently a product direction under validation. We are studying where semantic layout understanding can deliver value beyond existing tools.
DESIGN SYSTEM INTELLIGENCEA clearer way to
build interfaces.
Good UI decisions shouldn't disappear inside a codebase.
Make them discoverable, reusable and understandable.