Codex Dev

Web design and dev toolkit: device mockups, design inspector, CSS editor, SEO audit, asset extractor, screenshots and AI edits.

Codex Dev – The all-in-one toolkit for web designers and developers Test, inspect, edit and audit any website without leaving your tab. Codex Dev brings responsive testing, a visual design inspector, live CSS editing, SEO audits, asset extraction, screenshots, client feedback and AI-powered design edits together in one extension. 🖥 Responsive viewer with real device mockups See any site on phones, tablets and desktops side by side, inside realistic device frames with notches, Dynamic Island and browser bars. Choose from a large device catalog, rotate devices, and scroll, click and type in sync across all of them. Take a full-page screenshot of any device with one click. 🎯 Design Inspector Click any element to see its spacing, sizes, fonts, colors, contrast and accessibility details. Measure distances between elements, view the box model and grid lines, and nudge margins, padding and fonts directly on the page. A movable toolbar with quick hover tips shows how each tool works. ✨ Codex AI – design edits in plain language (bring your own key) Select any element and describe the change: "make this section look more modern", "put these cards in a row", "add a nice hover effect". Codex AI edits the live page right away, with hover states and mobile layouts included, and you can undo every change. It sees a screenshot of your selection and follows the site's own fonts, colors and spacing. Works with your own Claude (Anthropic) or ChatGPT (OpenAI) API key. Codex AI is built for design and development work only. ✏ Visual CSS Editor Style typography, colors, spacing and layout visually and see updates instantly. Force :hover and :active states to debug them, and export any element to CodePen with one click. 📈 SEO audit Get a weighted SEO score with clear fixesns, canonical tags, headings and headingorder, robots and indexing, Open Graph and social cards, structured data, image alt text and sizes, lazy loading, mixed content and link quality. ump straight to the problem. Preview yourGoogle result, review the heading outline, and check every link's HTTP status. 📌 Feedback pins for clients and teams Pin notes to any element, mark them as a or info, and resolve them as you go. Pinsstay attached to their elements when the page scrolls or resizes. Share them as Markdown for GitHub, Jira or Linear, or export a clean PDF report withscreen sizes. 📦 Asset extractor Find every image, SVG, video, font and icon on the page (including inside iframes). Download a single file or everything as a ZIP. Lottie animations ar in the panel; save them as JSON, .lottieor a standalone HTML file that plays anywhere. 📸 Screenshot capture Capture the visible area, a full page (wiaders), a custom area or a single element,as PNG, JPEG or WEBP. 🔒 Privacy first No account, no tracking, no analytics. Seback pins are stored only on your device.Codex AI sends your selection only when you press send, straight to the AI provider you chose with your own key. Every other tool works entirely in y 🆓 Free and open source Source code: https://github.com/himavamsi12/codex-dev Built by developers, for developers.