BrowseryTools 🛠️

A comprehensive collection of 136+ browser-based tools built with Next.js, TypeScript, and Tailwind CSS. Every tool runs entirely in your browser — no uploads, no servers, no accounts required. Includes on-device AI tools (transcription, translation, summarization, image upscaling, and more) powered by Transformers.js.

📚 Table of Contents

• Features
• Tech Stack
• Supported Languages
• Prerequisites
• Getting Started
• Running Tests
• Project Structure
• Contributing
• Contributors
• Activity
• Reporting Issues
• Supporting the Project
• Star History
• License
• Contact

🚀 Features

🖼️ Image Tools

• Background Removal: Remove background from your images instantly using AI.
• Phone Mockups: Place screenshots into iPhone/Android device frames.
• Image Compression: Compress images to reduce file size while maintaining quality.
• Format Converter: Convert images between different formats like JPG, PNG, WebP, GIF, BMP, TIFF, and SVG.
• Color Correction: Adjust colors, brightness, contrast, saturation, and hue in images.
• SVG Tools: Edit and manipulate SVG vector graphics.
• SVG to PNG: Convert SVG vector files to PNG images.
• Photo Censor: Redact sensitive parts of an image with blur, pixelate, or black-box censoring.
• Screenshot Beautifier: Turn plain screenshots into beautiful images.
• Meme Generator: Make a meme online for free.
• Photo Collage: Combine multiple photos into a collage with grid, strip, and mosaic layouts.
• Image Color Picker: Pick any color from an image.
• EXIF Remover: Strip EXIF metadata - GPS location, camera model, timestamps - from photos before sharing.
• ASCII Art Generator: Convert any image into ASCII art in your browser.
• Image Upscaler: Upscale and enhance images 2x with an on-device AI super-resolution model.
• Image Captioner: Generate a descriptive caption and ready-to-use alt text for any image with an on-device AI model.
• Depth Map Generator: Generate a depth map from any image with an on-device AI model.
• Object Cutout: Cut out any object from an image with one click using the Segment Anything (SAM) AI model in your browser.
• Image Resizer: Resize images to exact dimensions or by percentage.
• Color Blindness Simulator: Simulate how images appear to people with different types of color blindness: deuteranopia, protanopia, tritanopia, and achromatopsia.
• EXIF Viewer: View EXIF metadata from photos: camera model, lens, aperture, shutter speed, ISO, GPS coordinates, and more.
• Favicon Generator: Create a complete favicon set from an image or a letter/emoji.

🤖 AI Tools

• Token Counter: Count tokens for any text across popular AI models: GPT-4o, Claude, Llama 3, and more.
• Context Window Calculator: Calculate how much of a model's context window your text uses.
• AI Cost Calculator: Estimate your AI API costs by entering token counts and selecting a model.
• Model Comparison: Compare AI language models side by side: context window size, pricing, capabilities, speed, and provider.
• System Prompt Builder: Build structured system prompts for AI models using a guided form.
• Prompt Library: Save, organize, and search your AI prompts locally in the browser.
• CLAUDE.md Generator: Generate CLAUDE.md files for your projects using a structured form.
• AI Rules Generator: Generate .cursorrules, .windsurfrules, and GitHub Copilot instruction files for your IDE.
• JSON Schema Builder: Build JSON schemas for LLM tool calls and function calling using a visual form.
• MCP Config Generator: Generate Model Context Protocol (MCP) configuration files for Claude Desktop and other MCP clients.
• Prompt Formatter: Convert prompts between different AI formats: ChatML, Llama 3 Instruct, Claude XML tags, and plain text.
• Skill / Agent Builder: Scaffold AI agent skill files with a guided form.
• AI Instruction Diff: Compare two system prompts, CLAUDE.md files, or AI instruction sets side by side.
• Text Similarity: Measure semantic similarity between texts using TF-IDF cosine similarity, all in the browser.
• Sentiment Analyzer: Detect positive or negative sentiment in text with an on-device AI model.
• Audio/Video Transcriber: Transcribe audio or video to text and generate SRT/VTT subtitles with on-device Whisper AI.
• Text Summarizer: Summarize long text into a short summary with an on-device AI model.
• Translator: Translate text between 15 languages fully on-device with an AI model.
• PII Detector & Redactor: Detect and redact personal info - names, emails, phone numbers, locations, credit cards, IPs - with an on-device AI model.
• Zero-Shot Text Classifier: Classify any text into your own custom labels with an on-device AI model.

📁 File Tools

• PDF Tools: Merge, split, compress, and manipulate PDF files.
• Zip Tools: Create, extract, and manage ZIP archives.
• CSV/Excel Viewer: View and edit CSV and Excel files in your browser.
• File Converter: Convert files between different formats including documents, images, audio, and video.

🎵 Media Tools

• Video Editor: Trim, convert, and edit video files.
• Audio Editor: Edit and process audio files.
• Mic & Camera Tester: Check your camera preview and test microphone input levels with a live meter.
• Compress Video: Compress videos in your browser using ffmpeg.wasm.
• Screen Recorder: Record your screen, window, or tab directly in the browser using the Screen Capture API.

📝 Text & Language Tools

• Text Case Converter: Convert text between different cases: uppercase, lowercase, title case, camelCase, snake_case, and more.
• Text Counter: Count words, characters, lines, and paragraphs in text.
• Code Formatter: Format and beautify your code with proper indentation and syntax highlighting.
• Rich Editor: Edit and preview rich text documents with formatting options.
• Lorem Ipsum Generator: Generate placeholder text for designs and mockups.
• Typing Test: Measure your typing speed (WPM) and accuracy with optional mechanical keyboard click sounds.
• Text Diff Viewer: Compare two texts and copy a simple patch.
• Markdown Editor: Write Markdown with a live split-pane preview.
• HTML Formatter: Format, prettify, or minify HTML code.
• Notepad: A distraction-free scratch pad that saves your notes automatically to the browser.
• Text Sorter: Sort lines of text alphabetically, by length, or numerically.
• Morse Code Converter: Convert text to Morse code and decode Morse code back to text.
• Word Frequency Analyzer: Analyze word frequency in any text.
• Markdown to HTML: Convert Markdown to clean HTML instantly.
• Text Repeater: Repeat any text or character N times with a custom separator.
• Markdown Table Generator: Build tables in a visual grid editor and export as valid Markdown table syntax.
• Image to Text (OCR): Extract text from images for free with on-device OCR.
• Text to Speech: Read text aloud in your browser for free.
• Speech to Text: Convert speech to text online for free.

📊 Data Tools

• JSON to CSV: Convert JSON data to CSV format for spreadsheet applications.
• Base64 Tools: Encode or decode Base64 strings and files.
• QR Code Generator: Generate QR codes from text, URLs, contact information, and more.
• Barcode Generator: Generate various barcode types including CODE128, EAN-13, UPC-A, CODE39, and more.
• QR Code Scanner: Scan QR codes using your camera or upload an image.
• Barcode Scanner: Scan barcodes using your camera or upload an image.
• Charts: Create beautiful, customizable charts with full control over every detail.
• JSON Formatter: Format, validate, and minify JSON.
• YAML ↔ JSON: Convert between YAML and JSON formats instantly.
• URL Encoder/Decoder: Encode or decode URLs and query strings.
• Fake Data Generator: Generate realistic fake data for testing and prototyping.
• Text to Binary: Convert text to binary, hexadecimal, octal, and decimal representations.
• JSON → TypeScript: Paste JSON and instantly get TypeScript interfaces.
• Mermaid Diagram Viewer: Write Mermaid markdown and see your diagram rendered live.

🧮 Math & Finance Tools

• Invoice Generator: Create professional invoices with customizable templates, automatic tax calculations, and PDF export.
• Unit Converter: Convert between different units of measurement including length, weight, temperature, area, volume, and more.
• Time Zone Converter: Convert times between different time zones.
• Calculator: Advanced calculator with basic, scientific, and graphing modes.
• Age Calculator: Calculate your exact age in years, months, and days.
• Number Base Converter: Convert between binary, octal, decimal and hexadecimal with live validation.
• Expense Tracker: Track your expenses with detailed categorization, budget management, and comprehensive reports.
• Currency Converter: Convert between all major currencies in the browser using cached daily rates and animated number display.
• Loan Calculator: Calculate monthly payments, total interest, and amortization schedules for mortgages and loans.
• Percentage Calculator: Calculate percentages, percentage change, percentage of a number, and reverse percentages.
• Aspect Ratio Calculator: Calculate and lock aspect ratios for images and videos.
• BMI Calculator: Calculate Body Mass Index (BMI) in metric or imperial units.
• Tip Calculator: Calculate tips and split bills between multiple people.
• Periodic Table: Interactive periodic table of all 118 elements in the standard layout.
• Roman Numeral Converter: Convert numbers to Roman numerals and Roman numerals back to numbers.

⚡ Productivity Tools

• Todo List: Organize your tasks and stay productive.
• Timer & Countdown: Simple timer and countdown with fullscreen mode and completion sound.
• Pomodoro Timer: Boost focus with the Pomodoro Technique.
• World Clock: View current time in multiple cities and time zones simultaneously.
• Stopwatch: Precise stopwatch with lap times and split tracking.
• Habit Tracker: Track daily habits and build streaks.
• Keep Awake: Prevent your laptop or phone from sleeping.
• Random Picker: Generate random numbers, roll dice, flip a coin, or pick a random winner from a list.
• Mind Map Maker: Create interactive mind maps in your browser.
• Signature Maker: Create an online signature: draw it freehand with adjustable pen color and thickness, or type your name in a handwriting font.

🧑‍💻 Developer Tools

• UUID Generator: Generate Universally Unique Identifiers (UUIDs) in different versions and formats.
• Unix Timestamp Converter: Epoch seconds/milliseconds ↔ human date with timezone.
• Regex Tester: Test JavaScript regular expressions with live highlighting and flags.
• Cron Parser: Explain cron expressions and list next runs.
• HTTP Status Codes: Quick reference for all HTTP status codes with descriptions, use cases, and examples.
• CSS Minifier: Minify or beautify CSS code.
• SQL Formatter: Format and beautify SQL queries with proper indentation and keyword casing.
• Chmod Calculator: Calculate Unix file permissions visually.
• Meta Tags Generator: Generate HTML meta tags, Open Graph tags, and Twitter Card tags.
• cURL Converter: Convert a curl command into ready-to-run code for JavaScript fetch, Node.js, Python requests, Go, and PHP.

🔐 Security Tools

• JWT Decoder: Decode and validate JSON Web Tokens (JWTs).
• Password Generator: Generate secure passwords with custom options including length, character types, and special requirements.
• Hash Generator: Generate cryptographic hashes from text input.
• Password Strength: Analyze the strength of any password in real time.
• Text Encryption: Encrypt and decrypt text using AES-256-GCM via the Web Crypto API.

🎨 Design Tools

• CSS Gradient Generator: Create beautiful CSS gradients visually.
• Color Palette Generator: Generate harmonious color palettes from a base color.
• Color Converter: Convert between HEX, RGB, and HSL with live preview.
• Color Contrast Checker: Check color contrast ratios for WCAG accessibility compliance.
• Emoji Picker: Browse and search all Unicode emojis by name or category.
• CSS Box Shadow Generator: Build CSS box shadows visually with sliders for offset, blur, spread, color, and opacity.
• CSS clip-path Generator: Visually create CSS clip-path shapes.
• Cubic-Bezier Easing Editor: Design CSS easing curves with two draggable control handles, easing presets, numeric inputs, and a live animation preview.
• Glassmorphism Generator: Create frosted-glass (glassmorphism) CSS visually.
• SVG Blob Generator: Generate random organic blob shapes and smooth SVG wave dividers.
• Code Screenshot: Turn code into beautiful, shareable images.
• OG Image Generator: Generate 1200x630 Open Graph and social-share images on a canvas.

🛠️ Tech Stack

• Framework: Next.js 15 with App Router
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: Shadcn + Radix UI
• State Management: Zustand
• Icons: Lucide React
• Animations: Framer Motion
• Testing: Vitest + React Testing Library

🌍 Supported Languages

BrowseryTools is fully localized. The entire UI — homepage, all tools, and navigation — is available in:

Language	Code	Direction
English	en	LTR
العربية (Arabic)	ar	RTL
Español (Spanish)	es	LTR
Português do Brasil (Portuguese)	pt-BR	LTR
Français (French)	fr	LTR
Deutsch (German)	de	LTR
Русский (Russian)	ru	LTR
Bahasa Indonesia (Indonesian)	id	LTR
简体中文 (Simplified Chinese)	zh-CN	LTR

Language is detected from the browser on first visit and can be changed anytime via the in-app language switcher (preference is remembered).

Adding a new language is intentionally simple — all locale wiring derives from one registry:

1. Add an entry to LOCALES in src/lib/locales.ts.
2. Add a messages/<code>.json file (a full translation of messages/en.json).
3. Register its import in the messages map in src/providers/language-provider.tsx.

The switcher, <html lang/dir>, hreflang tags, and OpenGraph locales all update automatically.

📋 Prerequisites

• Node.js 20.0 or higher
• npm, yarn, pnpm, or bun

🚀 Getting Started

1. Clone the Repository

git clone https://github.com/aghyad97/browserytools.git
cd browserytools

2. Install Dependencies

bun install

3. Run the Development Server

bun dev

Navigate to http://localhost:3000.

🧪 Running Tests

bun run test          # Run all tests
bun run test:watch    # Watch mode
bun run test:coverage # Coverage report

🏗️ Project Structure

src/
├── app/                    # Next.js App Router pages
│   ├── (home)/            # Home page
│   ├── blog/              # Blog listing and posts
│   └── tools/             # Individual tool pages
├── components/            # React components
│   ├── ui/               # Reusable UI components (shadcn)
│   └── [ToolName].tsx    # Tool-specific components
├── lib/                  # Utility functions
│   ├── tools-config.ts   # Tool registry
│   ├── blog-data.ts      # Blog post metadata
│   └── search-utils.ts   # Fuzzy search
└── store/                # Zustand stores

🤝 Contributing

Adding a New Tool

1. Add the tool entry to src/lib/tools-config.ts
2. Create the page at src/app/tools/[tool-name]/page.tsx
3. Create the component at src/components/[ToolName].tsx
4. The tool will automatically appear in the homepage grid and sitemap

Submitting a Pull Request

1. Fork the repository and create a feature branch
2. Make your changes with TypeScript types
3. Run bun run test to ensure nothing is broken
4. Submit a PR with a clear description

👥 Contributors

Thanks to everyone who has contributed to BrowseryTools!

📈 Activity

One-time setup: Generate a Repobeats embed at repobeats.axiom.co for aghyad97/browserytools, then replace the placeholder URL below with the generated one and remove this note.

🐛 Reporting Issues

Open an issue with a clear description, steps to reproduce, and browser/OS info.

💖 Supporting the Project

• ⭐ Star the repository on GitHub
• GitHub Sponsors: Sponsor us
• Ziina: One-time donation

⭐ Star History

📄 License

Copyright (C) 2026 Aghyad.

Licensed under the GNU Affero General Public License v3.0 (AGPL-3.0) — see LICENSE for the full text.

In short: BrowseryTools is free and open source. You may use, study, modify, and redistribute it. If you run a modified version as a network service (e.g. a hosted website or SaaS), you must make your modified source code available to its users under the same license. This keeps the project and any derivatives open.

📞 Contact

• GitHub Issues: Open an issue
• Twitter: @aghyadev

---

Made with ❤️