About CloneKit - Website Cloning Tool
𧬠CloneKit - Website Cloning Tool
Extract the design DNA of any website and clone it with AI in seconds!
βββββββββββββββββββββββββββββββββ
π§ FRAMEWORK SELECTION
βββββββββββββββββββββββββββββββββ
- Tailwind CSS β React + tailwind.config.js
- Bootstrap 5 β HTML + CSS variables
Select your framework before analysis, and the prompt is automatically generated for your chosen framework.
βββββββββββββββββββββββββββββββββ
π EXTRACTED DATA
βββββββββββββββββββββββββββββββββ
π¨ Color Palette - All used colors (HEX codes)
π€ Fonts - Font families and usage counts
π¦ Assets - Image, SVG, and icon counts
π§© Components - Button, form, card, link counts
π Sections - Hero, Features, Footer, CTA detection
π Layout - Header/Footer/Sidebar structure
π Spacing - Padding, margin, border-radius values
πΈ Full Page Screenshot - Visual reference with scroll+stitch
βββββββββββββββββββββββββββββββββ
β¨ KEY FEATURES
βββββββββββββββββββββββββββββββββ
- Component-First - Page split into sections, each with its own prompt
- Layout Detection - Flex/Grid structure auto-detected
- Arbitrary Values - Exact pixels for Tailwind: p-[32px], rounded-[16px]
- Full Page Screenshot - Capture entire page (up to 8 viewports)
- Prompt Generator - Ready-to-paste prompts for ChatGPT, Claude, Gemini
- Multi-Framework - Tailwind CSS or Bootstrap 5 output
βββββββββββββββββββββββββββββββββ
π EXPORT OPTIONS
βββββββββββββββββββββββββββββββββ
π JSON - Copy all extracted data
π€ Prompt - AI-ready full page prompt
πΈ Screenshot - Scroll+stitch entire page (JPEG)
π Section Prompt - Individual prompt for each section
βββββββββββββββββββββββββββββββββ
π― WHO IS IT FOR?
βββββββββββββββββββββββββββββββββ
- Frontend Developers - Rapid prototyping
- Web Agencies - Client reference site analysis
- Designers - Site inspection for inspiration
- Students - Learning from real websites
βββββββββββββββββββββββββββββββββ
π HOW TO USE
βββββββββββββββββββββββββββββββββ
1. Navigate to the website you want to clone
2. Click the CloneKit icon
3. Select framework (Tailwind/Bootstrap)
4. Click "Analyze Page" button
5. Copy π€ Prompt + πΈ Screenshot
6. Paste into AI β Pixel-perfect code!
π Privacy: All processing happens locally. No data is sent to external servers.
Made with β€οΈ by Extify.co
Read the full description