Bookmarks for Devs

Developer Tools

13 Free Developer Tools, No Sign-Up Required

Thirteen free online developer tools that run in your browser with no account and no upload: color, SEO, conversion, and formatting utilities that just work.

September 5, 20268 min read#tools#web-utility#frontend#css

Most "free online developer tools" want an email address before they will format your JSON. These do not. Thirteen small utilities live in the toolbox on this site — every one of them runs in your browser, none asks for an account, and none of them sends your input anywhere. Here is what each does and when you would actually reach for it.

What "no sign-up" means here

It means what it says, and one thing more: nothing leaves the tab. Each tool is a client-side island — your input is parsed, drawn, or encoded by your own browser, and there is no request carrying it to a server. That matters most for the two people usually assume are uploads. The image converter reads your files locally, draws them to a canvas, re-encodes them with the browser's own encoders, and zips the results in JavaScript. The favicon generator does the same with FileReader and a canvas. You can watch the network tab and confirm it.

The practical consequences: no rate limit, no file size cap beyond your machine, no watermark, and no reason to think twice about pasting an API response with real data in it.

Color: palettes and contrast

Tailwind palette generator

Paste one brand hex and the Tailwind palette generator returns the eleven shades Tailwind expects — 50 through 950 — placed on the same lightness curve Tailwind's own palettes use, so your color sits next to slate without looking heavier or washed out. Give it #b9471b and you get a full ramp with contrast ratios, ready to paste into a v4 @theme block or a v3 config. Every step is computed in OKLCH rather than by mixing with white and black, which is what stops the mid-tones going muddy. Reach for it at the start of a project, once.

Color contrast checker

The contrast checker takes two colors and reports the ratio against all five WCAG 2 thresholds at once — normal text, large text, and UI components — with live samples at the sizes those thresholds are actually about. Put #b9471b on #fefdfb and you get a pair that passes AA and misses AAA, which is the interesting case. When a pair fails, it works out the nearest passing color by moving lightness only in OKLCH, so the suggestion is still recognizably your color rather than a different one. This is the one to open when a designer hands you a spec.

SEO: the tags and files search engines read

Meta tag generator

Search engines truncate a title by pixel width, not character count, which is why the "60 characters" rule both passes titles that get clipped and flags ones that would have fitted. The meta tag generator measures the rendered width, draws the result the way Google would, and hands back the complete <head> block — meta, Open Graph, and X card tags. Type a title, a description, a canonical, and an OG image URL, and you get the snippet plus a preview showing exactly where the cut lands.

JSON-LD generator

Structured data is easy to get almost right, and almost-right silently produces no rich result. The JSON-LD generator builds valid markup for Article, FAQPage, Product, Organization, and BreadcrumbList from a form, so the nesting is correct by construction — an author comes out as a nested Person object rather than the bare string that quietly breaks it. Paste markup you already have and it will pretty-print and check that instead.

robots.txt generator

The file that blocks your entire site differs from the one that blocks nothing by a single character. The robots.txt generator builds the file from user-agent groups, allow and disallow rules, crawl-delay, and sitemap URLs, with presets for allowing everything, blocking AI crawlers, and locking down a staging site. It also flags the folklore as you go: Crawl-delay is ignored by Google and Bing, and the whole file governs crawling rather than indexing, which is why a disallowed page can still show up in results.

UTM builder

Campaign reports fill up with Email, email, and e-mail as three separate sources because everyone builds these by hand. The UTM builder appends the parameters properly — keeping any query string and fragment the URL already had, and percent-encoding values so an ampersand in a campaign name cannot break the link. Feed it https://example.com/pricing with source newsletter, medium email, campaign spring-launch, and you get a correctly encoded link plus warnings about the capitalization that would have split the campaign across rows.

OG image generator

The OG image generator draws an Open Graph card on a canvas in the tab: type a title and description, pick a size and a theme, drop in a logo if you have one, and download a 1200×630 PNG. No account, no upload, no watermark. The title shrinks to fit before it is ever cut, so a long headline stays whole rather than running off the edge. Useful the day before launch, when every blog post needs a card and nobody wants to open a design tool.

Converters

SVG to JSX

React will not take raw SVG. The SVG to JSX converter camelCases attributes, turns class into className, converts inline style strings into objects, and drops xmlns, with optional currentColor, a size prop, and TypeScript output. Paste a 24-pixel arrow carrying stroke-width="2" and class="icon" and you get a component with strokeWidth and className — and a list of what changed, which is how you catch the classic mistake of camelCasing data- and aria- attributes too.

Image converter

The image converter converts and resizes images to WebP, AVIF, JPEG, or PNG at a quality you choose, and shows exactly how many bytes each one saved. Drop in a folder of screenshots at a max width of 1600 and quality 0.8, and you get WebP files back with per-file savings, downloadable one at a time or as a zip. Reach for it when a page is slow and the images are the reason.

JSON to TypeScript

Paste an API response into the JSON to TypeScript converter and get interfaces for it. The useful part is arrays: every element is merged into one type, so a key missing from some of them becomes optional and a key that is a string in one and null in another becomes a union. A members array whose second entry has no profile and a null email produces profile? and email: string | null — which is the fact the payload was telling you, and the whole reason to generate types instead of writing them.

Everyday dev utilities

CSS clamp calculator

Fluid typography replaces a stack of font-size media queries with one clamp() declaration, and the hard part is the middle argument. The clamp calculator works it out from two anchor points: 16px at a 320px viewport growing to 24px at 1280px gives you the declaration, the slope and intercept behind it, and what the text actually measures at every common width from 320 to 1536. Seeing the small end before you ship it is the point.

Favicon generator

A favicon is not one file any more. The favicon generator takes a PNG, an SVG, or just a couple of letters and produces the set that is actually used now — 16, 32, 48, 180, 192, and 512 pixel PNGs, a real multi-size favicon.ico, a web app manifest, and the <head> tags to reference them. Type two initials, pick a foreground and background, and the whole set comes out. Your image never leaves the page.

JSON formatter

The JSON formatter formats, minifies, sorts keys, and validates. When a document will not parse it gives you the exact line and column where it broke instead of "invalid JSON", which is the part that costs time. There is no size limit but your machine, and nothing is uploaded — which matters more for JSON than for most formats, because the JSON you need to format is usually a response with somebody's data in it.

What these tools are not

They are single-purpose utilities, not a platform. There are no saved projects, no history, and no sync between devices, because there is no account to hang any of that on. Anything that genuinely needs a server — crawling your site, rendering at scale, running a build — is not here and should not be. If you want the larger, hosted tools instead, they are in the catalog under developer tools.

FAQ

Are these developer tools really free with no account?

Yes. There is no sign-up, no free tier with a limit behind it, and no watermark on anything you download. They are free because they cost nothing to run — the work happens on your computer, not on a server someone has to pay for.

Do my files or pasted data get uploaded anywhere?

No. Every tool is client-side: text you paste and files you drop are processed in the browser tab and never sent over the network. Open your browser's network panel while you use one and you will see no request carrying your input.

Can I use these on a phone or tablet?

Yes — they are ordinary web pages and work on a mobile browser. The ones with a lot of form fields, like the robots.txt and JSON-LD generators, are more comfortable on a larger screen, but nothing is desktop-only.

Which one should I use for checking accessibility?

The contrast checker, and only for color contrast. It answers one WCAG question well; it is not an accessibility audit, and it will not tell you about focus order, labels, or heading structure.