CSS Inspector & Color Picker — MimicKit

Stop screenshotting design. Start pasting real code. MimicKit is the CSS inspector for Chrome that turns any website into copy-ready code for your AI workflow. Inspect any element, copy its CSS as Tailwind classes, extract the full color palette, identify every font, and download every SVG and image — in one click. Built for developers using Cursor, Claude, v0, Lovable and Bolt. ⚡ WHAT MIMICKIT DOES 🔍 CSS to Tailwind Converter (170+ properties) Click any element on any website. Get its computed CSS as clean code — or as Tailwind utility classes. Real conversion across spacing, layout, flex, grid, typography, color, borders, shadows, transforms, transitions, SVG and tables. State variants (hover:, focus:, active:, placeholder:) and arbitrary values (p-[17px]) included. Anything Tailwind doesn't cover returns as clean fallback CSS — nothing silently dropped. 🎨 Color Picker + Cloud Library Pixel-accurate eyedropper plus a smart palette extractor that pulls every brand color from a page, weighted by the screen area each color actually occupies. Save hex, RGB, HSL or OKLCH to your personal library — cloud-synced across every device and browser you sign into. A modern alternative to ColorZilla in one tap. 🔤 Font Finder & Typography Inspector Identify every font used on any website: family, weight, size, line-height, letter-spacing, plus the CSS selector for each usage. Tap the crosshair to highlight every element using a given font directly on the page. A modern alternative to WhatFont with cloud-synced favorites. 🖼 Image & SVG Downloader Bulk-download every image from a page in original quality, or grab every SVG icon embedded in the DOM with inline preview, markup copy, and one-click recolor. Drop into Figma, Cursor or your component library — no DOM hunting, no broken viewBoxes, no right-click-save-as marathon. 🧱 AI Design System Generator One click and MimicKit reverse-engineers the entire design system from any URL: colors, typography, spacing scale, radii, shadows, breakpoints. Export as Tailwind config, CSS variables, JSON tokens, Vue or standalone HTML. Includes an AI prompt with build instructions — so Cursor or Claude builds with the real tokens from prompt one. ♿ WCAG Contrast Scanner (AA / AAA) Scan every text-on-background pair on the page against WCAG AA and AAA for both normal and large text. Click any failing pair to highlight the offending element directly on the page. Export the full accessibility audit as JSON — perfect for QA reports and a11y reviews. 🎯 BUILT FOR • Frontend developers who use Cursor, Copilot, or Claude Code • Designers and devs building UI in v0, Lovable, Bolt or ChatGPT • Agency engineers reverse-engineering competitor design systems • Teams migrating projects to Tailwind • Anyone tired of fighting DevTools' nested DOM tree 💎 FREE VS PRO Free (forever, no credit card) • Inspect any element on any website (CSS, fonts, colors) • Color picker + full palette extraction • Font detector with family, weight, size and selectors • WCAG AA / AAA contrast checker • Download individual images and SVGs • 10 saved items in your library Pro (€6 / month or €49 lifetime — 3-day free trial, no card required) • CSS to Tailwind conversion (170+ properties) • Export to Code: HTML, CSS, Tailwind, Vue, React • AI Design System Generator with Cursor / v0 prompt • Bulk image and SVG ZIP downloads • SVG recoloring • Cloud sync library across devices • Unlimited saved items • Priority email support 🔐 PRIVACY Extraction runs entirely in your browser. We do not track your browsing history. We do not read page content automatically. We do not use Google Analytics or any third-party tracker on the extension UI. We store anonymous usage counts so plan limits work — and that is it. Read the full Privacy Policy at https://mimickit.com/privacy 🔗 LINKS • Website: https://mimickit.com • Privacy Policy: https://mimickit.com/privacy • Terms of Service: https://mimickit.com/terms • Support: mimickit.help@gmail.com