# Palette ## Colors - `#0EA5E9` primary - `#18181B` text - `#FAFAFA` surface ## Assets ### Images 12 selected PNG · 1.2MB ### Tokens ```typescript 1 colors: { 2 primary: '#6366F1' 3 accent: '#EC4899' 4 surface: '#FAFAFA' 5 } ``` Synced 12 tokens --- ## Capture Everything You Need for Any Design ### Powerful Features Help You Extract, Save, and Reuse Any Design Resources from the Web. ### 1. Live Inspector ### Inspect, Edit, Copy on Real Websites. Hover over any element to view CSS. Directly modify colors, fonts, or padding, and the page updates in real-time. Once satisfied with the design, copy the edited values as CSS or Tailwind. No DevTools tree, and changes won't be lost on refresh. [了解更多](/content/zh/features/css-inspector/index.html) ### 2. Code Export ### Extract Block as Code Select any block to get clean production-ready HTML + CSS. No more manually rebuilding layouts. [了解更多](/content/zh/features/inspect-export/index.html) ### 3. Asset Extraction ### Any Assets, Your Choice of Format. Download any images, icons, or backgrounds as PNG, JPG, or WebP. Choose a format freely during export, no conversion tools, no extra steps needed. [了解更多](/content/zh/features/asset-extractor/index.html) ### 4. Lottie ### Download Lottie Animation Detect and download any embedded Lottie JSON files from any website. Preview before downloading. [了解更多](/content/zh/features/lottie-extractor/index.html) ## Design Tokens → Tailwind Extract colors, fonts, spacing, and border-radius from any website. Export as directly pasteable `tailwind.config.js`. ## Save to Library Save colors, fonts, images, and SVGs to your personal library for later use. ## Cross-Platform Compatible Supported on Chrome, Brave, Edge, Arc, and all Chromium-based browsers. ## 100% Privacy Protection Runs entirely in your browser. No data is sent to any servers. ## Loved by Thousands of Designers ### User Reviews: > "As someone focused on the Backend, spending time on UI checks and complex CSS debugging is the quickest way for me to get frustrated. Luckily, this tool is incredibly well-designed, fluid, and fast, with a refreshingly simple interface. It streamlines my workflow perfectly." > — Soufian Loukili, Backend Developer > "Really impressed with MiroMiro. It saves a ton of time when inspecting websites. No more digging through devtools to find colors, fonts, spacing, assets, etc. Everything is just there instantly. Super useful for designers and frontend devs who want to move fast. Definitely recommend." > — Naivaidya Yadav, Frontend Developer > "Just tried Miromiro by @SoraiaDev. This is honestly perfect for no-code / frontend builders. One click and you get colors, fonts, spacing, assets — no DevTools digging. If you reverse-engineer landing pages or rebuild UIs fast, this saves a lot of time." > — Yusuke, Indie Maker > "I'm so glad MiroMiro launch got traction & showed up on my timeline! I can download assets + export color schemes + basically everything in just a few clicks!! I've been exploring so many websites with this extension, and as a data analyst building my first app, a no-code tool like this is truly a game changer." > — Nadia, Data Analyst & No-Code Builder ## A Simple Tool Designed for Efficient Designers Easily extract design resources, code blocks, and tokens. ## Free Trial Free trial of all Pro features for 3 days. Then €6/month — or a one-time purchase, claim your early lifetime slot before it’s gone. ### Pro Trial €0/3 days Full Pro experience for 3 days. No credit card needed. ### Pro Version €19 / €6/month Cheaper than your Spotify, use it forever. ### Lifetime Pro Version €49 / one-time One payment, then no worries. ## Browser Support ### Works Where You Work Available in Chrome, Edge, Brave, and Opera today. Firefox is under review. ## FAQs ### What is MiroMiro? MiroMiro is a tool to extract design resources, color schemes, CSS layouts, and more from websites to streamline your design process. ### Is MiroMiro realmente gratuito? Free 3-day trial with all Pro features unlocked, no credit card required. After 3 days, you’ll need to select a plan to continue using MiroMiro. ### Does it work with any website? MiroMiro works with almost all publicly available websites, including those built using React, Next.js, Vue, WordPress, Webflow, and Framer. Some sites with strict security policies may limit extraction capabilities. ### Is it legal to extract design from a website? Extracting CSS, colors, and layout patterns is standard practice for learning and inspiration. MiroMiro is a tool for researching how websites are built — like viewing source code. Respect copyright when using resources commercially. ### How is it different from DevTools? DevTools shows raw code. MiroMiro delivers clean, ready-to-use outputs — copy entire blocks as production-grade code, batch download resources, export complete design systems as Tailwind config without rummaging through the DOM. ### What happens at the end of the 3-day free trial? You’ll need to select a plan to continue using MiroMiro. Your saved library and extracted resources will remain intact. You can upgrade to Lifetime Pro (one-time payment) or Starter/Pro subscription plans with a click. ### Is my data safe? MiroMiro runs entirely in your browser. Extracted resources and library data stay on your device. We only store anonymous usage counts to manage plan limits — that’s it. ### Can I cancel or get a refund? You can cancel anytime in your profile — you’ll retain access until the end of the current billing cycle. Not satisfied? Contact us for a full refund within 14 days, no questions asked. ### Does it work with Cursor, Claude, and v0? Yes — this is exactly what it’s designed for. MiroMiro exports components as clean, semantic Tailwind HTML that you can paste directly into Cursor, Claude, Lovable, Bolt, v0, or ChatGPT. Your AI tools read real code with actual class names and real values, so it reconstructs, adapts, and combines instead of guessing from screenshots.