# Livery > Livery is a free tool that turns any public website's design into an installable design kit (a skill) for AI coding agents such as Claude Code, Cursor, Codex and Windsurf, measured from the live site rather than generated by a model. Livery renders a public website at desktop, tablet and phone widths, measures its colours, typography, spacing, radii, shadows, components, motion and craft details, and writes an installable kit: SKILL.md (the steps an agent follows), tokens.json, rules.md and notes on components, layout, motion, details, stack and voice. Agents audit the project, report the gap, ask which areas to apply and commit one area at a time. Kits describe style; to work with a site's own files, the Livery browser extension copies whole pages (text, images, videos, fonts) into Figma through the Livery for Figma plugin. Kits are free. Any kit can be fetched by an agent at https://www.livery.site/k//v/SKILL.md, and a new kit is built by requesting livery.site/. ## Pages - [Tools](https://www.livery.site/tools): Every Livery tool on one page: website or image to editable Figma layers or to an agent skill (a design kit). App to Figma and App to Skill are coming soon. - [Create a kit](https://www.livery.site/create): Paste a website (or several pages of one site, or a designer's favourite sites) and get an installable design kit. - [Library](https://www.livery.site/explore): Every published design kit: palettes, typography, spacing, components and motion measured from real sites. - [Tastes](https://www.livery.site/tastes): Kits that measure one person's taste across the sites they picked. - [How it works](https://www.livery.site/how-it-works): How Livery measures a site, writes the kit and how your agent applies it one area at a time. - [Install in your agent](https://www.livery.site/agents): Install steps for Claude Code, Cursor, Codex, Windsurf and claude.ai. - [Guides](https://www.livery.site/guides): Design systems for Claude Code, Cursor rules for design, design tokens for agents, style versus assets. - [Browser extension](https://www.livery.site/extension): Measure pages behind your login (dashboards, settings) into a private kit. Install it free from the Chrome Web Store: https://chromewebstore.google.com/detail/livery/joghhbmmhinhjflcadnikbkkpgcjlhoe - [FAQ](https://www.livery.site/faq): What Livery reads, what it copies, and which agents it supports. - [Image to design](https://www.livery.site/image-to-design): Turn screenshots, brand boards and mock-ups into editable Figma layers: text, frames with fills, corners, borders and shadows, logos as vectors. Read in the browser, no AI. - [Livery for Figma](https://www.livery.site/figma): Copy any website into Figma with the extension: every page, its text, images, videos and fonts. - [For site owners](https://www.livery.site/owners): Opt in with a livery.json file, check what LiveryBot sees, or opt out. - [LiveryBot](https://www.livery.site/bot): The crawler's user agent and the robots.txt rules it follows. ## Guides - [How to Give Claude Code a Design System](https://www.livery.site/guides/claude-code-design-system): Stop Claude Code shipping generic UI: give it a design system as a skill, with tokens, rules and the reasons behind them, and let it apply one area at a time. - [Cursor Rules for Design: Make AI-Built UIs Look On-Brand](https://www.livery.site/guides/cursor-rules-for-design): Use Cursor project rules to keep AI-generated UI on-brand: where to put design tokens, what rules to write, and how to keep Cursor's agent from drifting. - [Design Tokens for AI Coding Agents: What to Hand Over](https://www.livery.site/guides/design-tokens-for-ai-agents): Which design tokens an AI coding agent actually needs (colour roles, type scale, spacing, radii, shadows, motion) and how to structure them so it applies them well. - [Recreate a Website's Look Without Copying It](https://www.livery.site/guides/recreate-a-websites-look): How to borrow a website's design style for your own app without copying its assets: what's style (colours, spacing, type scale) and what belongs to the owner. ## Design kits - [scholarxiv.com design kit](https://www.livery.site/k/scholarxiv-com/v4): design system, light theme, Archivo. Skill: https://www.livery.site/k/scholarxiv-com/v4/SKILL.md - [farmjs.dev design kit](https://www.livery.site/k/farmjs-dev/v5): design system, dark theme, Geist Pixel Square. Skill: https://www.livery.site/k/farmjs-dev/v5/SKILL.md - [robi.work design kit](https://www.livery.site/k/robi-work/v3): design system, light theme, Lexend. Skill: https://www.livery.site/k/robi-work/v3/SKILL.md - [linear.app design kit](https://www.livery.site/k/linear-app/v3): design system, dark theme, Inter Variable. Skill: https://www.livery.site/k/linear-app/v3/SKILL.md - [goatrank.lol design kit](https://www.livery.site/k/goatrank-lol/v5): design system, dark theme, Inter. Skill: https://www.livery.site/k/goatrank-lol/v5/SKILL.md - [rize.roggy.site design kit](https://www.livery.site/k/rize-roggy-site/v2): design system, dark theme, DM Sans. Skill: https://www.livery.site/k/rize-roggy-site/v2/SKILL.md - [kinfish's taste design kit](https://www.livery.site/k/taste-kinfish-30602b/v2): a design taste, light theme, GeistSans. Skill: https://www.livery.site/k/taste-kinfish-30602b/v2/SKILL.md - [Robi's taste design kit](https://www.livery.site/k/taste-robi-2dc854/v2): a design taste, light theme, Lexend. Skill: https://www.livery.site/k/taste-robi-2dc854/v2/SKILL.md - [gitstreak.eyu.et design kit](https://www.livery.site/k/gitstreak-eyu-et/v1): design system, dark theme, Manrope. Skill: https://www.livery.site/k/gitstreak-eyu-et/v1/SKILL.md - [voxide.app design kit](https://www.livery.site/k/voxide-app/v3): design system, light theme, Geist. Skill: https://www.livery.site/k/voxide-app/v3/SKILL.md - [ANDY's taste design kit](https://www.livery.site/k/taste-andy-9ea6f0/v1): a design taste, dark theme, GeistSans. Skill: https://www.livery.site/k/taste-andy-9ea6f0/v1/SKILL.md - [vercel.com design kit](https://www.livery.site/k/vercel-com/v1): design system, light theme, GeistSans. Skill: https://www.livery.site/k/vercel-com/v1/SKILL.md - [blyp.dev design kit](https://www.livery.site/k/blyp-dev/v1): design system, light theme, Manrope. Skill: https://www.livery.site/k/blyp-dev/v1/SKILL.md - [livery.site design kit](https://www.livery.site/k/livery-site/v1): design system, light theme, Inter. Skill: https://www.livery.site/k/livery-site/v1/SKILL.md - [dagmawibabi.com design kit](https://www.livery.site/k/dagmawibabi-com/v1): design system, light theme, ui-sans-serif. Skill: https://www.livery.site/k/dagmawibabi-com/v1/SKILL.md - [apple.com design kit](https://www.livery.site/k/apple-com/v1): design system, light theme, SF Pro Display. Skill: https://www.livery.site/k/apple-com/v1/SKILL.md - [kinfish.dev design kit](https://www.livery.site/k/kinfish-dev/v3): design system, light theme, GeistSans. Skill: https://www.livery.site/k/kinfish-dev/v3/SKILL.md - [nuzz.space design kit](https://www.livery.site/k/nuzz-space/v1): design system, dark theme, DM Sans. Skill: https://www.livery.site/k/nuzz-space/v1/SKILL.md - [mikaelen.site design kit](https://www.livery.site/k/mikaelen-site/v2): design system, dark theme, DM Sans. Skill: https://www.livery.site/k/mikaelen-site/v2/SKILL.md - [virvid.ai design kit](https://www.livery.site/k/virvid-ai/v2): design system, dark theme, Inter. Skill: https://www.livery.site/k/virvid-ai/v2/SKILL.md - [yishak-tule.vercel.app design kit](https://www.livery.site/k/yishak-tule-vercel-app/v1): design system, light theme, Playfair Display. Skill: https://www.livery.site/k/yishak-tule-vercel-app/v1/SKILL.md - [huly.io design kit](https://www.livery.site/k/huly-io/v2): design system, dark theme, esbuild. Skill: https://www.livery.site/k/huly-io/v2/SKILL.md - [google.com design kit](https://www.livery.site/k/google-com/v1): design system, light theme, sans-serif. Skill: https://www.livery.site/k/google-com/v1/SKILL.md - [novatsega.com design kit](https://www.livery.site/k/novatsega-com/v1): design system, light theme, Caveat. Skill: https://www.livery.site/k/novatsega-com/v1/SKILL.md - [bilt.nogs.dev design kit](https://www.livery.site/k/bilt-nogs-dev/v1): design system, dark theme, Outfit. Skill: https://www.livery.site/k/bilt-nogs-dev/v1/SKILL.md - [useravn.com design kit](https://www.livery.site/k/useravn-com/v1): design system, light theme, Mona Sans. Skill: https://www.livery.site/k/useravn-com/v1/SKILL.md - [wireme.framer.website design kit](https://www.livery.site/k/wireme-framer-website/v1): design system, light theme, Inter Display. Skill: https://www.livery.site/k/wireme-framer-website/v1/SKILL.md - [amour-frontend-psi.vercel.app design kit](https://www.livery.site/k/amour-frontend-psi-vercel-app/v2): design system, light theme, Inter. Skill: https://www.livery.site/k/amour-frontend-psi-vercel-app/v2/SKILL.md - [mamas-baking-joy.base44.app design kit](https://www.livery.site/k/mamas-baking-joy-base44-app/v2): design system, light theme, ui-sans-serif. Skill: https://www.livery.site/k/mamas-baking-joy-base44-app/v2/SKILL.md - [kidus-yohannes.engineer design kit](https://www.livery.site/k/kidus-yohannes-engineer/v1): design system, light theme, serif. Skill: https://www.livery.site/k/kidus-yohannes-engineer/v1/SKILL.md - [tars.pro design kit](https://www.livery.site/k/tars-pro/v1): design system, light theme, Roobert. Skill: https://www.livery.site/k/tars-pro/v1/SKILL.md - [kacha.et design kit](https://www.livery.site/k/kacha-et/v1): design system, dark theme, Inter. Skill: https://www.livery.site/k/kacha-et/v1/SKILL.md - [koyeb.com design kit](https://www.livery.site/k/koyeb-com/v1): design system, dark theme, Anton. Skill: https://www.livery.site/k/koyeb-com/v1/SKILL.md - [earlyvet.xyz design kit](https://www.livery.site/k/earlyvet-xyz/v1): design system, light theme, Barlow. Skill: https://www.livery.site/k/earlyvet-xyz/v1/SKILL.md - [amie.so design kit](https://www.livery.site/k/amie-so/v1): design system, light theme, Inter. Skill: https://www.livery.site/k/amie-so/v1/SKILL.md - [shein.com design kit](https://www.livery.site/k/shein-com/v1): design system, light theme, -apple-system. Skill: https://www.livery.site/k/shein-com/v1/SKILL.md - [ahadu-mu.vercel.app design kit](https://www.livery.site/k/ahadu-mu-vercel-app/v1): design system, light theme, Geist. Skill: https://www.livery.site/k/ahadu-mu-vercel-app/v1/SKILL.md - [orbit.dagidev.com design kit](https://www.livery.site/k/orbit-dagidev-com/v1): design system, dark theme, Inter. Skill: https://www.livery.site/k/orbit-dagidev-com/v1/SKILL.md - [chapa.co design kit](https://www.livery.site/k/chapa-co/v1): design system, light theme, Inter Tight. Skill: https://www.livery.site/k/chapa-co/v1/SKILL.md - [brandappart.com design kit](https://www.livery.site/k/brandappart-com/v1): design system, light theme, Youth. Skill: https://www.livery.site/k/brandappart-com/v1/SKILL.md ## Optional - [Full text for language models](https://www.livery.site/llms-full.txt) - [Privacy](https://www.livery.site/legal/privacy): what is collected, and how the browser extension handles data - [Terms](https://www.livery.site/legal/terms)