Devtoolkit All Your Devel

DevToolkit - All your developer tools, one click away

A browser extension built for web developers, designers, and digital agencies.

DevToolkit brings 25+ essential tools into a single popup — no new tabs, no logins, no juggling multiple extensions.

🏆 Everything You Need, Right in Your Browser
DevToolkit replaces a drawer full of separate tools with one lightweight extension that opens in a single click. Free tools for everyday work, and a Pro upgrade for specialist workflows.

📸 Full Page Screenshot
Capture complete full-page screenshots of any website. Export as PNG or JPEG with custom scale, optional fixed element hiding, and custom filename templates.

🎨 Color Picker
Sample any color from any webpage and copy instantly as HEX, RGB, HSL, or HSV. Includes color history and one-click copy for any format.

🔍 CSS Inspector
Hover over any element to inspect its full computed CSS — box model, typography, colors, flexbox, grid, and effects. Includes a Complete CSS tab to copy the entire CSS block in one click. Now includes Page Design Summary — scan any page to extract its full color palette as clickable swatches and a complete typography map showing every font family, size range, and weights in use.

📦 Asset Downloader
Discover and download all images on a page including lazy-loaded assets. Filter by size and type, then download individually or in bulk.

🐛 Debug Panel
Clear cache, localStorage, sessionStorage, and IndexedDB with one click. Inject custom CSS or JavaScript for instant testing. Includes an image performance auditor.

🔎 SEO Audit
Instant on-page SEO report covering meta title and description, heading structure (H1–H6), canonical URL, robots meta, Open Graph, Twitter Card, structured data, image alt texts, internal and external links, and Core Web Vitals signals. Export a full PDF report with one click.

🧱 Sitestack — Technology Detector
Identify the CMS, frontend framework, CDN, hosting provider, analytics tools, and SSL status of any website. Invaluable for competitive research and pre-sales discovery.

⏰ Task Reminders
Built-in task manager with scheduled desktop notifications. Reminders fire even when the popup is closed.

✏️ Edit Mode
Switch any webpage into a live editable document with one click. Click any text to edit it directly in the browser — ideal for content proofing, design reviews, and client demos.

🔒 Site Lock
Lock any website behind a 4-digit PIN to prevent casual access. Supports a Lock Now button, per-session memory, and instant unlocking on return visits.

🔡 String Tool
Live text statistics — character count, word count, sentence count, paragraph count, line count, and reading time. Includes 9 case conversions (UPPERCASE, lowercase, Title Case, camelCase, snake_case, kebab-case, PascalCase and more), 8 text transforms including sort, reverse, and remove duplicates, Find & Replace with regex support, and character limit bars for Twitter, Meta description, page title, and LinkedIn.

💚 Wellness Breaks — Developer Health Reminders
DevToolkit is the only browser developer tool with built-in developer wellness support. Long coding sessions cause eye strain, back pain, repetitive stress injuries, and chronic fatigue. Wellness Breaks fights this with 13 science-backed health reminders that fire as desktop notifications while you work — no apps to install, no timers to set.

Eye care reminders: 20-20-20 Rule, 20-20-20-20 Rule, Blink Reminder, Dry Eye Relief, Palming.

Posture & body reminders: Posture Check, Shoulder Relax, Wrist Stretch, Neck Stretch.
Movement reminders: Walk Break.

Focus reminders: 50-10 Break, 1-Hour Screen Break.

Hydration reminders: Hydration Reminder.

Also includes 6 setup tips for screen distance, screen height, brightness matching, night mode, outdoor time, and pre-sleep screen habits.

Choose between desktop notification or full-screen break overlay. Four overlay styles: Classic, Pulse, Frosted, and Gradient. All reminders are free — because every developer deserves to stay healthy.

🔒 Pro Features:

📐 Responsive Preview
View any website in live, interactive iframes at Mobile, Tablet, and Desktop breakpoints side by side. Add custom device sizes, rotate portrait/landscape, sync scroll across frames.

🔤 Font Detector & Downloader
Discover every font actively rendering on a page — Google Fonts, custom fonts, and system fonts. Download font files directly from the extension.

📧 Email Finder
Extract all publicly visible email addresses from any page. Deep scan mode checks /contact, /about, /team, and other sub-pages. Export as CSV or plain text.

🍪 Cookie Editor
Full cookie management: view, create, edit, and delete cookies with all attributes. Import and export in JSON, Netscape, or HTTP Header format.

🚫 Element Remover
Hide, remove, or blur any element on any page — banners, popups, cookie notices, navigation. CSS selector targeting, undo stack, and export hidden element rules as a CSS file.

📋 Content Extractor
Extract text, links, images, headings, tables, meta data, or any custom CSS selector from any page. Export as JSON, CSV, or plain text.

🖼️ Mockup Generator
Turn any webpage screenshot into a polished device mockup for client presentations and portfolios. Five presentation styles with background options and PNG export.

📏 Ruler & Measurement
Measure any element or distance on any page with pixel precision. Four measurement modes: Line, Box, Element, and Distance.

🔗 Open Links in New Tabs
Scan, filter, and preview all links on a page, then open them in new tabs at once. Includes scope filters, delay between tabs, and a confirmation step before opening.

✂️ Easy Copy
Click any link, button, dropdown, or navigation item to copy its text without triggering navigation. Includes hover mode, copy history, and URL copy on right-click.

⌨️ Dev Formatter
10 developer tools in one panel — JSON formatter with syntax highlighting, Base64 encode/decode, JWT decoder with expiry detection, URL encoder/decoder/parser, Unix Timestamp converter with live clock, UUID v4 generator and validator, MD5/SHA-1/SHA-256/SHA-512 hash generator, HTML Entities encoder/decoder, CSS formatter and minifier, and Number Base converter between Decimal, Binary, Hex, and Octal. All processing runs locally — nothing leaves your browser.

✅ Why Choose DevToolkit
👉 25+ tools in a single popup — no tab switching
👉 Free tools available without any account or payment
👉 Pro upgrade is a one-time payment with no subscription
👉 Built-in developer wellness reminders — eye care, posture, hydration, movement
👉 All processing runs locally — no data collected or transmitted
👉 Built on Chrome Manifest V3 — modern, secure, and future-proof
👉 Works on Chrome and Microsoft Edge

🎯 Built For
👉 Frontend developers inspecting, debugging, and auditing websites
👉 Designers working with layouts, colors, typography, and spacing
👉 SEO professionals reviewing page structure and on-page signals
👉 Freelancers and agencies managing client websites
👉 Anyone who wants a faster, cleaner development workflow
👉 Developers who care about their long-term health and screen habits

💬 Frequently Asked Questions

Is DevToolkit free?
DevToolkit has a permanently free tier with 14 tools available at no cost, no account required. A one-time Pro upgrade unlocks 11 additional specialist tools including Dev Formatter, Responsive Preview, Font Detector, Cookie Editor, and more.

Does it work on all websites?
DevToolkit works on the vast majority of modern websites. Some tools that require script injection may not function on sites with strict Content Security Policies, such as certain banking or high-security platforms.

Is my data safe?
Yes. DevToolkit does not collect, transmit, or sell any personal data. All tools run entirely inside your browser. No account or sign-in is ever required for any feature.

How do I activate Pro?
After purchase you receive a licence key by email. Enter it in DevToolkit → Settings → Licence and click Activate. Pro features unlock instantly.

Does Wellness Breaks require any permissions or accounts?
No. Wellness Breaks uses Chrome's built-in alarm and notification system. No external service, no account, no data collection. Your health reminders stay completely private.