Fast, browser-based developer tools

Everything runs locally — nothing leaves your device.

139

Tools

Format & Validate

Parse, diff, and preview structured data and text.

17 tools

Formatters & viewers9

{ }

JSON Formatter

Format, validate and repair JSON — exact big numbers, JSONC comments, tree with path copy, JSONPath.

JSON → TypeScript

TypeScript, Zod, JSON Schema, Go, Pydantic, Rust and C# types from sample JSON.

{✓}

JSON Schema Form

Paste a JSON Schema, get a live form, and validate data against it with every error listed.

SQL

SQL Formatter

Pretty-print SQL across MySQL, PostgreSQL, SQL Server, and more, with keyword casing and indent options.

gql

GraphQL Formatter

Format or minify GraphQL queries and schemas, and infer GraphQL types from a JSON response.

API

OpenAPI Viewer

Browse OpenAPI 3 and Swagger 2 specs: endpoints, schemas, example payloads and curl commands.

{;}

Code Beautifier

Beautify or minify HTML, CSS, and JavaScript — format messy code or shrink it for production.

.md

Markdown Preview

Markdown editor that renders like GitHub — alerts, Mermaid, outline — with HTML/PDF export.

diff

Diff Viewer

Side-by-side code diffs with word highlights, structural JSON/YAML diff, patch viewer.

Run & test3

▶

Code Runner

Run JavaScript, TypeScript and Python in your browser — npm imports, pandas, charts, line-accurate errors.

/re/

Regex Tester

Highlights matches and groups, explains the pattern, unit-tests it and writes it for 7 languages.

run

SQL Playground

Run real PostgreSQL 18 and SQLite in your browser — query plans, CSV import, exports.

Visual builders5

ERD

DB Designer

Draw ER diagrams and export PostgreSQL, MySQL, SQLite, Prisma, DBML or Mermaid. Imports SQL and Prisma.

◇→{}

Flowchart to Code

Draw an algorithm with decisions and loops and get JavaScript, TypeScript, Python or Mermaid.

FSM

State Machine Designer

Draw states and transitions with guards and actions; export XState v5, a TypeScript reducer or Mermaid.

React Flow Playground

Draw nodes and edges and copy a ready React Flow component in TSX or JSX, or the nodes and edges as JSON.

blk

Blockly → Code

Snap visual blocks together, see JavaScript, Python, PHP, Lua and Dart, and run it.

🔐

Security & Encoding

Decode tokens, hash data, and encode content securely.

14 tools

Tokens & auth4

JWT

JWT Decoder

Decode a JWT, check claims and expiry, flag risky settings, and verify its signature.

sign

JWT Builder

Sign JWTs with HS, RS, PS, ES or EdDSA — generate key pairs and JWKS, in your browser.

401

Basic Auth Header

Turn a username and password into an Authorization: Basic header, Base64 creds, and curl example.

2fa

TOTP / 2FA Generator

Live TOTP/HOTP codes from a secret, QR screenshot or Authenticator export — verify codes, make setup QRs.

Crypto & keys7

SHA

Hash Generator

MD5, SHA-1/2/3, Keccak and CRC32 for text or files — SRI, sha256sum files and verification.

MAC

HMAC Generator

Create and verify HMAC signatures, and check GitHub, Stripe, Slack, Shopify and Svix webhooks.

AES

AES Encrypt / Decrypt

Password-based AES-256-GCM encryption via Web Crypto. Salt + IV packed into the output. Fully local.

2b$

Bcrypt Generator

Hash passwords with an adjustable cost factor and verify a password against an existing hash.

***

Password Generator

Secure passwords, EFF passphrases and PINs — plus a pattern-aware strength and breach checker.

ssh

SSH Key Generator

Ed25519, RSA and ECDSA key pairs as OpenSSH, PEM or JWK, made with Web Crypto in your browser.

SSL

SSL Certificate Decoder

Decode PEM certificates, chains and CSRs — names covered, issuer, expiry, key, extensions, fingerprints.

Encoding & codes3

b64

Base64 Encoder

Base64, Base64URL, Base32 and hex for text or files — data URIs, UTF-16, file-type detection.

▦

QR Code Generator

Styled QR codes for links, Wi-Fi, contacts and events, checked to scan. Batch export and a reader.

▮▯▮

Barcode Generator

EAN-13, UPC-A, Code 128, Code 39 and ITF-14 with check digits. SVG, PNG, PDF and label sheets.

⌘

Dev Utilities

Everyday developer conversions and calculators.

19 tools

Convert8

env

.env ↔ JSON

Parse dotenv files into JSON or turn a JSON object back into a .env file, with quoting handled.

yml

YAML ↔ JSON

Convert YAML config to JSON and back instantly, with error reporting. Runs in your browser.

tml

TOML ↔ JSON

Convert TOML configuration to JSON and back, including tables and arrays of tables.

xml

XML Formatter

Pretty-print, minify and validate XML, or convert between XML and JSON.

String Escape

Escape text for JSON, JavaScript, SQL, shell, regex, HTML, or URLs with one click.

Slugify

Turn any text into a clean URL-safe slug with accent stripping and separator options.

curl

cURL to Code

Turn curl, fetch() or HAR requests into code for 17 clients, .http files or Postman — secrets as env vars.

🐳

docker run → compose

Turn docker run commands into docker-compose.yml, and draw any compose file as a diagram with problem checks.

DevOps & network6

755

chmod Calculator

Click read/write/execute boxes to get octal (755) and symbolic (rwxr-xr-x) permissions and the command.

/24

Subnet Calculator

Network, broadcast and host range for any IPv4/IPv6 block, plus VLSM planning and CIDR merging.

k8s

Kubernetes YAML Generator

Deployment, Service, Ingress with TLS, ConfigMap and autoscaler from one form, ready for kubectl apply.

git

.gitignore Generator

Pick your languages, frameworks, editors, and OSes to build a ready-to-use .gitignore file.

200

HTTP Status Codes

A searchable reference of every common HTTP status code — 200, 301, 401, 404, 500 — and what it means.

User-Agent Parser

Decode a UA string into browser, engine, OS and device — and spot crawlers.

Web & reference5

utm

UTM Builder

Add utm_source, utm_medium, and campaign tags to any link for Google Analytics tracking.

img

README Badge Generator

Build shields.io badges with custom label, color, style and logo. Copy Markdown or HTML.

bot

Robots.txt Generator

Build robots.txt rules, block AI crawlers in one click, and test whether any URL is allowed for a bot.

GMT

Time Zone Converter

World clock and meeting planner — compare cities, see working hours side by side, find a time that suits everyone.

⌨

Keycode Tester

Press any key to see event.key, event.code, keyCode and modifiers, and copy a ready-made key handler.

⚙

Generators

Generate IDs, schedules and fake data, plus ready config files for nginx, Docker, CI, CSP and linting.

23 tools

Everyday6

uid

UUID Generator

UUID v1–v7, ULID and NanoID in bulk, in any format. Decode IDs to see when they were made.

* *

Cron Generator

Build or paste cron, read it in English, see runs in any time zone, convert for AWS, Quartz, k8s.

UTC

Timestamp

Unix time in s, ms, µs or ns ↔ dates in any zone, plus Excel and Windows epochs, durations and logs.

mock

Fake Data Generator

Generate dummy names, emails, and addresses as JSON, CSV, or SQL to seed databases and tests.

^1.x

Semver Range Calculator

See what ^, ~, x and hyphen ranges match, test against real npm versions, compare versions.

✉

Email Signature Generator

Email-safe HTML signature for Gmail, Outlook and Apple Mail with photo, socials and one-click copy.

Server & security config7

ngx

Nginx Config Generator

Reverse proxy, SPA, static or PHP server blocks with HTTPS, www redirects, gzip, caching and WebSockets.

.htaccess Generator

Apache rules for HTTPS, www, 301 redirects, caching, gzip, hotlink protection and password protection.

pwd

.htpasswd Generator

bcrypt, APR1-MD5 or SHA-1 entries for Apache and nginx basic auth, plus a hash verifier.

csp

Content-Security-Policy Generator

Build a CSP from directives, add Google Fonts, Analytics, Stripe or YouTube in one click, and spot unsafe-inline.

hdr

Security Headers Generator

HSTS, X-Frame-Options, Referrer-Policy, Permissions-Policy, COOP/COEP and CORS for any server.

sec

security.txt Generator

RFC 9116 security.txt with contacts, expiry, PGP key and policy links — validated as you type.

🐋

Dockerfile Generator

Multi-stage Dockerfiles for Node, Next.js, SPAs, Python and Go, with cache mounts, non-root user and .dockerignore.

CI & automation3

gha

GitHub Actions Generator

CI workflows for Node, Python and Go with matrices and caching, or multi-arch Docker builds to GHCR.

gha

GitHub Actions Builder

Lay out jobs on a canvas, connect them to set needs, edit steps, and get the workflow YAML.

n8n

n8n Workflow Builder

Chain triggers, HTTP requests, If, Set, Code and Wait nodes and copy workflow JSON to paste into n8n.

Project files & git7

tsc

tsconfig & package.json

tsconfig.json and package.json for Next.js, Vite, Node or an npm library, with every strict flag explained.

lint

ESLint, Prettier & EditorConfig

Matching .editorconfig, .prettierrc and ESLint flat config for React, Next.js, Vue or Node.

pwa

PWA Manifest Generator

manifest.webmanifest with icons, shortcuts and screenshots, an installability checklist and splash preview.

README Generator

README.md with badges, install, usage, config table, roadmap, contributing and license — with live preview.

LICENSE Generator

Pick MIT, Apache, GPL and more with a plain-language comparison, and get the full LICENSE file.

git

Git Command Builder

Undo, branch, stash, recover — pick what you want to do and get the exact Git commands, explained.

feat

Commit Message Builder

Conventional Commits with type, scope, breaking changes, issues and co-authors — lint-checked.

Text & Data

Transform, count, generate, and encode text and numbers.

17 tools

Text7

Case Converter

Convert between camelCase, snake_case, kebab-case, PascalCase, CONSTANT, Title Case and more.

Word Counter

Live word, character, sentence, and paragraph counts with reading time and word frequency.

txt

Lorem Ipsum

Generate placeholder text by paragraphs, sentences, words, or bullet lists. One-click copy.

Text Diff

Compare two blocks of text and highlight additions and deletions word by word or line by line.

A↓

Text Sorter & Dedup

Sort lines alphabetically, numerically, or by length, remove duplicates, reverse, or shuffle.

𝔉

Fancy Text

Turn text into bold, cursive, gothic, and bubble Unicode fonts to copy into social bios and posts.

🔊

Text to Speech

Read text aloud with your browser's built-in voices and adjustable rate, pitch, and volume.

Encode & convert6

URL Encoder

Percent-encode and decode URLs and query strings with a live query-parameter breakdown.

HTML Entities

Escape and unescape HTML entities like < & ", or encode all non-ASCII characters.

Number Base

Convert between binary, octal, decimal, and hexadecimal live. Handles very large integers.

U+

ASCII / Unicode

Look up any character's code point, HTML entity, CSS/JS escape, and UTF-8 bytes. ASCII table included.

HTML to Markdown

Turn HTML into clean Markdown — headings, nested lists, tables and code blocks.

jsx

HTML to JSX

Convert HTML for React — className, style objects, self-closing tags.

Tables & CSV4

csv

JSON ↔ CSV

Convert a JSON array of objects to CSV and back, with custom delimiters and type coercion.

▦

CSV Viewer / Editor

Paste or upload CSV to a sortable, editable table — add rows, rename columns, then export.

⊞

Markdown Table

Fill a visual grid, set column alignment, and copy a clean GitHub-flavored markdown table.

sql

SQL INSERT Generator

CSV, Excel or JSON to INSERT, upsert or MERGE for Postgres, MySQL, SQLite, SQL Server and Oracle.

🎨

Design & Visual

Build visuals, optimize assets, and generate markup.

45 tools

Makers7

▤

Page Builder

Drag-and-drop landing pages and multi-page sites. Link pages together, export clean HTML and CSS.

✦

Logo Maker

A logo from your name, an icon or initials, fonts and colours. SVG and PNG, plus a favicon-ready symbol. Arabic too.

▣

Post & Flyer Designer

Social posts, stories and flyers from templates, in your brand. Magic resize to every size. Arabic too.

📊

Chart Maker

Bar, line, area, pie and donut charts from pasted or CSV data. PNG, SVG and vector PDF.

~~>

Mermaid Diagram

Flowcharts, sequence, ER, Gantt and more from text — themes, zoom, PNG/SVG/PDF export.

png

Code to Image

Turn a code snippet into a highlighted PNG or SVG — ten themes, line highlights, social sizes.

📐

CAD Viewer

Open STEP, IGES, STL and DXF files. Measure, cut sections, estimate 3D prints, convert to STL or GLB.

Images & PDF11

✂

Image Editor

Resize, crop, rotate, flip and convert to JPG, PNG, WebP or AVIF — one image or a whole batch.

📦

Image Compressor

Re-encode and resize images to WebP, JPEG, or PNG with a live size-saved readout. Fully local.

Background Remover

Remove a photo background with AI that runs on your device. Transparent PNG, colour or blur. Never uploaded.

OCR

Image to Text (OCR)

Extract text from photos, screenshots and scanned PDFs in English and Arabic. Runs on your device.

🖼

Image → Base64

Convert an image to a data URI with ready-made CSS background and img-tag snippets.

📷

EXIF Viewer & Remover

Inspect a photo's hidden metadata and GPS location, then download a clean copy with it stripped.

💧

Image Color Picker

Pick exact pixel colours from an image, or extract its palette as CSS, Tailwind or JSON.

:::

Image to ASCII Art

Turn any photo into text art with adjustable width, character sets, and inversion.

svg

SVG Optimizer

Remove Inkscape/Illustrator metadata, comments, and editor bloat from SVG files.

PDF

Images to PDF

Combine JPG and PNG images into one PDF, reorder pages, set size and margins. Fully local.

📑

PDF Toolkit

Merge, split, reorder, rotate, number, watermark and compress PDFs. Never uploaded.

Color6

🎨

Color Converter

Paste any colour; copy it as HEX, RGB, HSL, OKLCH, Lab, P3, SwiftUI or Compose. Nearest Tailwind colour.

◧

Color Palette Generator

Press space for new palettes, lock colours, pick a harmony, export CSS variables, SCSS or Tailwind.

Contrast Checker

WCAG contrast ratio with AA / AAA pass-fail for normal text, large text, and UI components.

50-950

Tailwind Shade Generator

Expand one hex colour into a full 50–950 Tailwind scale using perceptual OKLCH lightness.

css

CSS Gradient

Layered linear, radial and conic gradients with draggable stops, OKLCH blending and Tailwind output.

◍

Mesh Gradient Generator

Soft multi-point gradient backgrounds from layered radial gradients — pure CSS, no images.

CSS & SVG effects13

▨

Box Shadow Generator

Stack multiple box-shadow layers with live sliders for offset, blur, spread, and opacity. Copy CSS.

◗

Border Radius Generator

Round each corner independently in px or %, preview the shape, and copy the shorthand.

◆

clip-path Generator

Drag points to shape any element — polygons, circles, ellipses, insets — and copy the CSS.

Text Shadow Generator

Stack text-shadow layers for glow, outline, retro, and 3D text effects. Live preview.

◐

CSS Filter Generator

Blur, brightness, contrast, grayscale, hue-rotate and more — preview on your own image.

▢

Glassmorphism Generator

Build frosted-glass cards with backdrop-filter blur, tint, and border. Copy the CSS.

⤴

cubic-bezier Editor

Drag control points to design a CSS easing curve, preview the animation, and copy the value.

@kf

CSS Keyframes Generator

Build @keyframes animations visually with a live preview, then copy the CSS.

◌

CSS Loader Generator

Pure-CSS spinners, dots, bars and progress bars — colour, size and speed, accessible markup.

▕

Custom Scrollbar Styler

Style scrollbars with colour, width, radius and hover — CSS for Chrome, Safari and Firefox.

btn

CSS Button Generator

Buttons with hover, active, focus and disabled states — six styles, contrast check, CSS or Tailwind.

〰

SVG Wave Generator

Create layered wave dividers for page sections. Copy or download the SVG.

⬮

SVG Blob & Pattern Generator

Organic blob shapes and seamless dot, grid, wave and zigzag patterns as SVG or CSS backgrounds.

Layout & units5

▚

Flexbox / Grid Playground

Toggle justify, align, direction, columns, and gaps. Live layout preview and copyable CSS.

▦

Grid Template Areas Builder

Paint named areas on a grid and get grid-template-areas CSS with a mobile stack, HTML or Tailwind.

rem

CSS Unit Converter

px to rem, em, vw, vh and pt — convert a whole stylesheet to rem and build fluid clamp() sizes.

16:9

Aspect Ratio Calculator

Find the ratio of any size and resize without distortion. Presets for video and social, plus CSS.

Type Scale Generator

Modular font-size scale, fixed or fluid with clamp() — preview at any width, export CSS, Tailwind or tokens.

Site icons & SEO3

⭐

Favicon Generator

favicon.ico, SVG, Apple and maskable icons from an image, letter or emoji — HTML and manifest included.

</>

Meta Tag Generator

SEO, Open Graph, X cards, JSON-LD and Next.js metadata with Google, social and Discord previews.

{ld}

Schema Markup Generator

JSON-LD for 14 Schema.org types — FAQ, Product, Local Business, Event, Recipe — with required-field checks.

🎬

Audio & Video

Record, trim and convert media — nothing is uploaded.

4 tools

REC

Screen Recorder

Record a tab, window or whole screen with a webcam bubble, system audio and mic. WebM or MP4 — no install.

▶

Video Editor

Trim, crop to 9:16, rotate, resize, speed up and compress video, or turn it into GIF or MP3 — no upload.

A→文

Speech to Text

Transcribe audio and video with Whisper AI on your device — 90+ languages, editable lines, SRT and VTT subtitles.

♫

Audio Trimmer & Converter

Cut or record audio, remove sections, trim silence, fade, change speed and convert to MP3, WAV or OGG.

A complete toolbox for developers — that respects your privacy

elefcode is a free collection of 139 developer utilities that run entirely in your browser. It brings the small tools you reach for every day — formatters, converters, encoders, generators, and calculators — into one fast, consistent workspace. There is nothing to install and no account to create: open a page and start working.

The defining feature is privacy. elefcode has no backend and no database. Whatever you paste, type, or upload is processed by JavaScript on your own device using standard browser APIs — the Web Crypto API for hashing and encryption, Canvas for image work, and more. Because your data never reaches a server, sensitive input like tokens, keys, config files, and photos stays with you.

The tools are organized into clear categories: Format & Validate for JSON and structured data, Security & Encoding for JWTs, hashing, and AES, Dev Utilities for everyday conversions, Text & Data for transforming content, and Design & Visual for colors, CSS, and images. New tools are added regularly.

Want to understand the concepts behind the tools? Our Guides explain topics like how JWTs work, what Base64 really does, cron syntax, Unix permissions, and more — in plain English, each linked to a tool you can try right away. For quick lookups, the Cheat Sheets cover regex, Git, Bash, Docker, SQL, Python, YAML, CSS, and more at a glance.