19 Free Online Converters: JSON, YAML, CSV, Markdown, Images, Colors & Code

Converting one format into another is one of those jobs that never justifies a real tool. You don't need a subscription to turn a CSS gradient into Tailwind classes, or a JSON blob into a TypeScript interface, or a batch of PNGs into WebP. What you actually need is thirty seconds, a paste box, and something that doesn't upload whatever you're converting to a server you've never heard of — because half the things people convert are internal config, client data, or a screenshot with something sensitive still visible in it.

The converters on FWD Tools are nineteen free, browser-based tools for exactly that job — data formats, code, CSS, colors, and images. Every one of them runs entirely on the page you're looking at: paste or drop a file, get the converted result, copy or download it. Nothing leaves your machine, there's no size cap tied to someone's server bill, and there's no account standing between you and a file you need converted right now.

Who these are for

Developers moving data between formats — JSON to YAML for a Kubernetes config, CSV to JSON for a script, an API response into a TypeScript interface so the editor stops complaining.
Frontend developers translating CSS and markup — a Tailwind class list back into real CSS to understand what it does, a static HTML mockup into JSX, REM values into pixels for a design handoff.
Anyone with an image in the wrong shape — too big, the wrong format, a logo that needs to become a favicon, a raster file that needs to be a scalable SVG.
Anyone converting something they'd rather not upload — API keys sitting in a JSON sample, a screenshot of an internal dashboard, a CSV export with real customer rows in it.

Data formats: JSON, YAML, CSV

YAML ↔ JSON Converter auto-detects which format you pasted and converts it to the other, with syntax-highlighted output, a key-sorting option, and full YAML 1.2 support — the format most CI configs, Kubernetes manifests, and Docker Compose files are written in, and the one format that's genuinely painful to hand-convert because indentation is meaningful. CSV → JSON Converter goes the other direction that comes up constantly: paste a spreadsheet export or a CSV from an API, and it infers types (numbers stay numbers, not strings), handles multiple delimiters, and shows a live table preview before you commit to the conversion. Both are RFC-compliant where it matters and both work in reverse — JSON back to CSV, JSON back to YAML — so it's one tool for the whole round trip.

Code that needs to become other code

JSON → TypeScript — Paste any JSON and get back TypeScript interfaces or type aliases, with nested objects, arrays of objects, optional fields, and null-safety all handled correctly. This is the fastest way to type an API response you don't control: paste a sample payload, get an interface, stop writing any.
HTML → JSX Converter — Turns a static mockup or a copied HTML block into valid JSX: class becomes className, for becomes htmlFor, kebab-case event attributes become camelCase, self-closing tags get their slash, and inline style strings become style objects. Useful the moment a designer hands over raw HTML and it needs to live inside a React component by end of day.
HTML to Markdown and Markdown to HTML — The two-way bridge between a CMS export and a README. HTML to Markdown handles tables, code blocks, links, images and lists cleanly enough to paste straight from a web page or an email template. Markdown to HTML renders GitHub-flavored Markdown — tables, task lists, fenced code — with a live preview, and exports either a bare HTML fragment or a full page.

CSS in two directions

CSS → Tailwind takes real CSS declarations — spacing, color, typography, flexbox, grid, borders — and returns the equivalent Tailwind utility classes, falling back to arbitrary-value syntax (w-[137px]) for anything that doesn't map to a standard scale value. Tailwind → CSS does the reverse, which is the more surprising use case: pointing it at a class list you inherited and getting back the actual CSS is often the fastest way to understand what a component is doing, faster than looking each utility class up individually. Both handle responsive and state variants (md:, hover:) and arbitrary values in either direction.

Small, precise conversions developers hit constantly

REM ↔ PX Converter — Bidirectional conversion with a custom base font size (defaults to the standard 16px, but editable for projects that override it), a live preview, and a reference table. The kind of tool that takes ten seconds to open and saves you doing the division in your head wrong.
Binary / Hex / ASCII Converter and Number Base Converter — For the moments a hex color, a binary flag, or a base-64 offset needs to become a decimal number or plain text, and back.
HTML Entity Encoder — Escapes and unescapes the characters that break markup when pasted raw — <, &, quotes — in either direction.
Unit Converter — Length, weight, temperature, and the other everyday units, for the times a design spec or an API response is in the unit you don't think in.
Color Contrast Checker — Not strictly a converter, but lives in the same "get one precise number and move on" category: paste a foreground and background color and get the WCAG contrast ratio and pass/fail rating instantly.

Images: format, size, and what's in the picture

Image Editor — Resize, crop, rotate, flip, compress and convert format in one place, with ten social-media size presets built in. The general-purpose tool to reach for when you're not sure which specific converter you need.
Image Compressor — Batch conversion to WebP, AVIF, JPEG or PNG with a quality slider and a split before/after preview, plus resizing in the same pass. The one to use when the real goal is smaller files, not a specific format.
Image to SVG — Traces a raster logo or icon into real vector paths with presets for logos, icons, sketches and illustrations, so a PNG-only logo becomes something that scales cleanly.
SVG to PNG — The reverse trip, for anywhere that won't accept an SVG: email clients, older CMSes, most social platforms. Export at 1×–4× or exact pixel dimensions.
Image to Base64 — Six output shapes — data URI, an <img> tag, a CSS background-image rule, raw Base64, and URL-encoded SVG — with format conversion and quality control on the way through.
Image to Text (OCR) — Reads the text in a screenshot, scan, or photo of a whiteboard and hands it back as editable text, in sixteen languages, with a confidence score per result.
Image Background Remover — Strips a background to transparent using color-based detection (fast and predictable on plain backgrounds, less reliable on busy ones) with a magic-wand mode for the exceptions.
Relight Photo — Not a format converter but a pixel one: adds draggable light sources with studio, product, neon and sunset presets to rescue a flat product shot.

Generating the derived assets a site needs

Favicon Generator converts one source image into the entire set a modern site actually needs: eight PNG sizes, a real multi-resolution favicon.ico, Apple Touch and Android Chrome icons, a site.webmanifest, and the exact <link> tags to paste into your <head> — downloaded as one zip. It's the classic fifteen-minutes-by-hand job turned into thirty seconds, and the natural last stop after you've used one of the other converters above to get your source image into shape.

A sensible order to do this in

Convert data formats before you convert code that depends on them. Get your JSON clean first, then generate the TypeScript interface from it — garbage in, garbage types out.
Go CSS → Tailwind only after the CSS is final. Converting mid-iteration styles just means re-converting them again in ten minutes.
Fix the image content before you convert its format. Crop, remove a background, or relight a photo before you compress or convert it — re-encoding an already-lossy JPEG twice throws quality away twice.
Generate favicons and derived assets last, once your source image is genuinely final, since every size in the output set bakes in whatever you gave it.

Frequently asked questions

Is anything I paste or upload sent to a server?

No. Every converter here runs the conversion in your browser tab — parsing, transforming, and rendering the result locally. There's no upload step, which is also why there's no waiting on a connection and no server-side size limit.

Are these really free, with no account or limit?

Free, no sign-up, no watermark, no daily cap. The only practical limit is your own device's memory on unusually large files or batches.

Which converter should I use for a Kubernetes or Docker config?

The YAML ↔ JSON Converter — most CI and container tooling is YAML underneath, and hand-converting indentation-sensitive YAML by eye is exactly the kind of small job that goes wrong quietly.

Can I convert more than one file at a time?

The Image Compressor is the batch tool — drop in as many images as you like and apply one setting to all of them. The data and code converters (JSON, YAML, CSV, HTML→JSX, and the rest) are single-paste tools by design, since batch conversion of structured text usually needs a script, not a UI.

How accurate is the CSS → Tailwind conversion?

It maps standard values (spacing, common colors, typical font sizes) to their exact Tailwind utility, and falls back to Tailwind's arbitrary-value syntax — like top-[13px] — for anything off-scale, so the output is always valid even when it isn't a "clean" utility class. Always spot-check the rendered result against the original CSS for anything with custom values.

Can I use the converted output commercially?

Yes — everything you produce is yours, free for commercial use, with no attribution required. Nothing is uploaded, so there's no copy of your data sitting on a server anywhere to begin with.

One paste box, whatever format you actually needed

None of these conversions are hard, individually. What they have in common is that hand-converting them is slow and error-prone, and most "free online converter" sites solve that by asking you to upload your data to a stranger's server first. Start with YAML ↔ JSON or CSV ↔ JSON if you're moving data between systems, CSS ↔ Tailwind if you're translating styles, or the Image Compressor if the problem is a file that's simply too big.

Explore more free browser-based developer tools at FWD Tools. From converters and generators to image editors, playgrounds, calculators, and productivity tools, everything runs locally in your browser with no sign-up required.

webdevpuneet