Use the design system you already have

Superposition is free and works on Windows, Mac & Linux.
Extract colors, typography, spacing, border radii, shadows and motions from sites, and exports them to CSS, SCSS, JavaScript and Adobe XD with a Plugin for XD. Sketch and Figma plugins are coming soon.
Would you recommend this product?
1 Review5.0/5
Hey everyone, author here. Thanks @fpresencia for hunting! I built Superposition because I think too few people have the access to the benefits that having a design system gives them, either due to time and budget constraints, or due to (client) design maturity. I want to make it possible for everyone to enjoy the benefits that a design system gives them, like speed and consistency. And I'm releasing it for free. Superposition is the first step towards this vision: A super easy way to use the design tokens that are already part of a website. You can export them to code or use them in our Adobe XD plugin, with more coming soon. The end goal is for Superposition to take you from website to design system in a single app.
Upvote (5)Share
This will sure come in handy! I like how it's visually similar to your other product Polypane, creates a nice family of products. I'm super impressed with the CSS bezier view. 👏
Upvote (3)Share
@rikschennink Thanks Rik! Parsing the custom beziers correctly was definitely a ton of work but I think it paid off nicely.
Upvote (1)Share
great tool ! but extensions don't work for me )
Upvote (2)Share
@karen_sarkissian Which OS + browser are you using?
@kilianvalkhof Windows 10 , Firefox Developer Edition
@karen_sarkissian There'll be an update of the extensions, 1.0.1, out soon that should fix it!
This is cool! Looking forward to the Figma version!
Upvote (2)Share
@figmacrush Working on it! 💪️
this is awesome, i found it really useful to grab vertical and horizontal spacing, and the code export is amazing! great to try out on different sites for inspiration too
Upvote (2)Share