Open a website in Chromium and extract its computed color palette, typography, CSS variables, spacing/radius/shadow primitives, and reusable component families.

Render supplied HTML and optional CSS in Chromium, then extract the same design system data as analyze_site. Useful for generated markup, offline pages, and tests.

Inspect elements matching a CSS selector on a live website. Returns bounds, selected computed styles, attributes, pseudo-elements, child structure, and a bounded HTML sample.

Open a website in Chromium and return a screenshot the agent can look at: the viewport, the full page, or a single element by selector. Optionally saves the image to disk.

Download the real images, background images, inline SVG icons/logos, videos, favicons, and web fonts a website uses into a local folder, with a manifest.json mapping each file to where it appears. Lets a replica reuse the exact original assets instead of re-drawing them.

Extract a website's motion design: @keyframes definitions, per-element animation and transition settings, detected animation libraries (GSAP, Framer Motion, AOS, Lottie, CSS scroll-driven), and scroll-triggered reveal effects captured by comparing styles before and after scrolling.

Return a simplified DOM tree of a page (or a subtree) with only layout-relevant computed styles per node (flex/grid, sizing, spacing, positioning) and section labels. Shows how the page is structured, not just its tokens.

Return a self-contained copy of one section: cleaned HTML (scripts/handlers stripped, inline SVG preserved), scoped CSS matching that subtree plus the @keyframes/@font-face it depends on, its assets, and a screenshot. With outputDir the assets are downloaded and URLs rewritten to relative paths, yielding a snippet that renders standalone.

Find and operate interactive triggers (hamburger menus, dropdowns, modals, tabs, accordions), then capture what they reveal: the revealed elements' selectors, bounds, HTML samples, and screenshots taken while the UI is open. Surfaces the parts of a design that never appear in a static extraction.

Extract how a website adapts across screen sizes: its breakpoints derived from @media rules, a summary of each media query (condition, rule count, sample selectors), and a layout tree captured at each requested viewport width. With outputDir, also saves a screenshot per width.

Screenshot the original website and a replica (local file or URL) at the same viewport with animations frozen, then pixel-diff them. Returns a match percentage, the worst-matching regions with coordinates, and a visual diff image. Use in a loop: build, compare, fix the worst regions, repeat.

One-shot capture of everything needed to replicate a website, written to a local folder: desktop + mobile screenshots, downloaded assets with manifest, design.json (tokens/colors/typography), layout.json (desktop + mobile trees), animations.json, and a REPLICATE.md guide. Loads the page once, so it is much faster than calling the individual tools separately.