design-replicate
CommunityClone web visuals into precise mockups
Design & Creative#tailwind#design-replication#mockup#visual-audit#interaction-analysis#browser-crawling#asset-downloader
AuthorPosteriot
Version1.0.0
Installs0
System Documentation
What problem does it solve?
It eliminates manual, guesswork-laden attempts to copy a website's look and feel by providing a structured workflow for auditing and rebuilding the UI with full visuals and behaviors.
Core Features & Use Cases
- Technical Audit: Commands browser_subagent to run extract_styles.js so you capture CSS variables, typography, and animation data before redesign.
- Asset & Behavior Capture: Combines scripts/asset_downloader.py usage with DOM snapshots to gather SVGs, fonts, and interactive logic for offline mockups.
- Verification Workflow: Uses references/audit-template.md to log spacing, animation, and interaction checks before comparing screenshots to the live site.
Quick Start
Use the design-replicate workflow to capture the target site's styles, download assets, and mirror behaviors in a standalone HTML/CSS/JS mockup.
Dependency Matrix
Required Modules
requests
Components
scriptsreferences
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: design-replicate Download link: https://github.com/Posteriot/makalah-app/archive/main.zip#design-replicate Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.