domains / families / design / ui-from-screenshot

ui-from-screenshot

authentic

Turn a screenshot or mockup into matching UI with the project's own components, then compare the result side by side with the image and fix the differences.

When to use

• Use when the person shares an image and asks to build it, recreate it or match it.
• Use when implementing a mockup or design export in the project's own components.
• Use when asked to "make it look like this".

When not to use

• Needs a clear image; blurry or cropped images get a request for a better one.
• Recreates layout and patterns of other companies' products, never their logos, names, photos or copy.
• Colors read from screenshots can be approximate unless pixels can be sampled.
• Similar real references need the optional UXKIN MCP tools and a UXKIN plan.

Skill page

Source