CodeShack: 400+ Developer Tools

Color picker, full-page screenshots, a CSS inspector, and SEO and accessibility checks. Reads a page only when you ask it to.

Pick colors from any website, take full-page screenshots, inspect an element's CSS and check the page for problems. Then send what you found to the matching tool on codeshack.io, already filled in, or search all 400+ of its developer tools. There is no account, and the extension has no analytics or tracking code of its own. It reads the page you are on only when you open the extension or use one of its commands, and it has no standing access to any website except codeshack.io. Press Ctrl+Shift+K (Cmd+Shift+K on a Mac), type two letters, press Enter. The inspector Click any element on a page to see what it is made of. - Its font, size and line height, plus its text and background colors with their contrast checked against WCAG AA. - The style rules that apply to it and its computed styles. - Run it in the Live Code Editor with the rules its children use, its hover and pseudo-element styles, the fonts and keyframes they need and the CSS variables resolved. Stylesheets another site will not let the extension read are left out, and the inspector says so. - Send its markup to the HTML tools, its rules to CSS Formatter or its colors to Color Contrast Checker. The color picker - A magnifier follows the pointer, so you can land on the exact pixel. Arrow keys move it one pixel, and Shift with an arrow key moves it ten. - The hex is copied the moment you pick it, and the color is shown as hex, RGB, HSL and OKLCH. - Its contrast on white and on black, the element and property it most likely came from and a CSS variable with the same value when the page defines one. - Shift-click to pick several in a row. The last twelve picks stay in a strip. Check the newest against the one before it, or turn them into a palette. - Alt+Shift+C starts it on any website without opening anything first. Screenshots - The visible area, or the full page, scrolled and stitched together. - A header that stays pinned to the top appears once, at the top, while chat buttons and most cookie banners are left out. - Drag out an area or click two corners, or click one element and get exactly that element, even when it is taller than the screen. - A three-second countdown, so a menu or a hover state can be open when it is taken. - Copy it to the clipboard, download it or send it to an image tool such as Screenshot Beautifier, Image to Text (OCR) Converter or AI Face Blur. - Alt+Shift+S selects an area and Alt+Shift+P takes the full page, on any website, without opening anything first. The other captures have shortcuts you can set. The page check A quick check for common problems, graded rather than pass or fail. A button that screen readers cannot name is a problem, a heading that skips a level is a warning and a page with no h1 gets a note. It is not a full accessibility or SEO audit. - Each issue lists the elements it found. Click one and it scrolls to it and outlines it on the page. - Accessibility checks include low-contrast text, images without alt text, buttons and links with no name and positive tabindex values. Zoom that is turned off or limited is flagged too. - SEO checks include titles that get cut off in search results, missing or disagreeing canonical links and structured data that will not parse. - Most issues come with a matching tool that opens with what it needs already filled in. A long title goes to SEO Title & Meta Checker with the title in it, low contrast goes to Color Contrast Checker with the lowest-contrast pair and duplicate ids go to HTML Validator with the page's markup. - Copy the whole report as Markdown and paste it into a ticket. - Keep it open in the side panel while you fix things, so it does not close every time you click the page. What it reads off a page Open it on any website and it reports what that page is made of. - Colors, ranked by how often each appears, with the role each plays. Click a swatch to copy the hex. - Fonts, with the weights they are really set in and how many elements use each. - SVGs, with duplicates merged. Preview one, then copy its markup or send it to an SVG tool. - Images from img tags and CSS backgrounds, up to 60 per page, with their real size and download size where the browser reports them, and whether each is missing alt text, broken or served far larger than it is shown. - Links, sorted into internal, external, on-page and other, with flags for links that have no text, nofollow links and http links on an https page. - Page details with the meta tags, Open Graph and X (Twitter) cards, structured data, the headings outline, language versions, the HTML's size, load timing and the response headers. - Web Vitals measured on your device, with LCP and the element behind it, CLS, the slowest interaction and FCP. - View the page's HTML in HTML Viewer, as it is now or as the server sent it before scripts changed it. - Preview how the page looks when it is shared, or in a search result, built from its own tags. - Open it on a raw JSON or XML file, an API response or a sitemap, and JSON Formatter or the XML tools are the first thing offered. On an image open in its own tab, the image tools are. It opens the tool with the data already in it Pick something it found and the matching tool opens with it already filled in. - A PNG is offered PNG Compressor, PNG to WEBP Converter and PNG Metadata to JSON, and a JPEG the JPG tools. - Pick the palette and every hex is filled in when Color Palette Generator loads. - Right-click a selection and it works out what the text is, so broken JSON goes to JSON Repair rather than JSON Formatter, CSS goes to CSS Formatter and a URL goes to URL Parser. - Make an image of selected code in Code to Image Converter, with the language already set. - No copying and pasting, and no saving a file just to upload it again. Tools Over 400 of them. They format and validate code, convert between formats, minify, encode and decode, hash, work with color and compress or convert images. - Search from the popup, or from the address bar by typing cs and pressing Tab. - Address bar shortcuts carry text into the tool, so cs sha256 hello opens SHA-256 Hash Generator with hello in it. The settings page lists every one. - Type a color, a timestamp, a JWT or some JSON after cs and press Enter. The right tool opens with it. - A bare format name, such as json, puts its main tool at the top, after any favorites or recent tools that match. - Your recent tools and starred favorites on the popup's home screen. Privacy No account and no sign-in. The extension contains no analytics or tracking code of its own. When it opens one of our tool pages, it tells that page which tool it opened and how the data was filled in, and that page's own analytics can count it. What you sent is never part of that. It reads a page only when you open the extension or use one of its commands, through the activeTab permission, and it has no standing access to any website other than codeshack.io. It does not request the tabs permission or access to all websites, so it cannot see your other tabs or your browsing history. Reading your clipboard is optional and stays off until you turn it on. The extension uploads nothing you send to a tool. It is handed to that page on your own device, not to a server, and a screenshot or a picked color stays on your device until you choose where it goes. A search that finds nothing opens the site's search page with what you typed, but text that looks like data, such as a token, a card number, an email address or a block of JSON, is kept out of it. Our tool pages show ads, including the pages the extension opens, so the ad partners' scripts run on the same page as what you send. What you send is never put in a page's address. The store's privacy section lists website content and user activity because the extension reads the page you are on, and the timing of your clicks and key presses on it for Web Vitals, when you ask it to. It does not send either to us. New in 1.2 (October 2026) - The color picker, the inspector and screenshots of an area or one element. - Web Vitals in page details and a side panel that stays open while you work. - Address bar shortcuts that carry text, so cs b64 hello opens Base64 Encoder & Decoder with hello in it. Free. Tools: https://codeshack.io/tools/ Privacy policy: https://codeshack.io/privacy-policy/