button · 173 × 40
Inspect any element
Hover to measure it, click to pull its styles. Real values, not guesses.
Colors · Fonts · Assets · Design systems
Copy any website's
design. In one click.
Penta AI is a design inspection preview for colors, fonts, icons and CSS from live pages, with exports for your next build or an AI prompt.
Everything a
page is made of.
Open Penta AI and read a page like a design file.
#4A4A52 on #FFF 8.48 AAA
Every color on the page
Full palette with contrast ratios and WCAG pass or fail beside each pair.
Aa56pxAa18pxAa14px
Inter · 400 500 600 700
Fonts and scale
Families, weights, sizes and line heights, with links to the source.
24 svg8 png3 mp42 lottie
.zip37 files · 2.4 MB
Assets in one click
Images, SVGs, icons, videos and Lottie files. Individually or as a zip.
--accent#0f7fff
--radius-card16px
--text-lg18px/1.5
--shadow-card0 1px 2px
A whole design system
Color scales, type scale, radii and shadows, exported to Tailwind, SCSS or JSON.
## Colors
- accent: #0f7fff
## Type
DESIGN.md for your AI
A spec your coding agent can build from, instead of a screenshot it cannot see.
▶in×Everything it reads
Colors, type, spacing, shadows and radii, plus every asset on the page, pulled straight off the live DOM.
Tailwind v4shadcn/uiDTCGCSS varsSCSSJSONDESIGN.md.zip
Everywhere it exports
Tailwind v4, shadcn/ui or DTCG tokens, or a DESIGN.md your coding agent can build from.
Explore Penta AI’s inspection and export tools in the Chrome extension.
Inspecting is free. Forever.
Plans only differ in how much you export.
Free
Perfect for individuals and small projects.
$0/ month
add to chrome- ✓Unlimited element inspections
- ✓100 asset downloads /mo
- ✓5 design system exports /mo
- ✓2 page clone exports /mo
Basic
Most popularIdeal for growing designers and builders.
$7/ month
add to chrome- ✓Unlimited element inspections
- ✓1,000 asset downloads /mo
- ✓30 design system exports /mo
- ✓15 page clone exports /mo
Pro
For large teams with specific workflows.
$12/ month
add to chrome- ✓Unlimited element inspections
- ✓Unlimited asset downloads
- ✓Unlimited design system exports
- ✓50 page clone exports /mo
- ✓Priority support
Preview plans. Install Penta AI from the Chrome Web Store. Billing is not enabled on this website.
Questions? Answers.
Everything you need to know about Penta AI.
Penta AI is a live preview for inspecting this page’s colors, fonts and design tokens.
The live preview reads this page’s computed colors and fonts, lets you copy values, and exports CSS variables, JSON tokens or a DESIGN.md brief. The broader extension features shown here are product concepts.
Not at all. Install Penta AI from the Chrome Web Store, open it on a page, and explore its inspection tools. It is built for designers, no-code builders and developers alike.
The product concept covers images, SVGs, icons, videos and Lottie files. This website preview exports design tokens and a design brief; bulk asset extraction is not enabled.
The working demo gathers computed color and font values from this page and organizes them into CSS, JSON or Markdown. Full Tailwind, shadcn/ui and DTCG exports are shown as product concepts.
The demo reads styles, copies values and generates files locally in your browser. It does not upload page content or save your inspection results to a server.
Page cloning is part of the proposed product. This preview does not clone external websites or export their source. You can download this page’s observed design values.
Yes. Install Penta AI from the Chrome Web Store, then use the extension’s panel controls to switch between floating and docked views.
The feature illustration shows a contrast-ratio example. The current live demo extracts colors; automatic contrast checking is not implemented in this preview.
The working demo supports CSS custom properties, JSON and DESIGN.md. Paid plans are illustrative and billing is not enabled.
Penta AI is available from the Chrome Web Store for desktop Chrome. Select Add to Chrome or Get Penta AI to view the extension listing.
Still stuck? with this preview.
designerdeveloperguestStop guessing at other
add to chrome
Stop guessing at other
people's CSS.
add to chromeColors. Fonts. Assets. A clearer view.