JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 63
  • Score
    100M100P100Q85539F

Powerful Model Context Protocol (MCP) server providing 128+ developer tools for AI agents (Claude, Cursor, Windsurf, Zed).

Package Exports

  • devtoolsonline-mcp
  • devtoolsonline-mcp/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (devtoolsonline-mcp) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

🧰 DevTools Online MCP

The official Model Context Protocol (MCP) server for DevTools Online.

npm version License: MIT Platform


Supercharge your AI assistants (Claude Desktop, Cursor, Zed, Windsurf) by empowering them with high-performance, local developer tools. No remote API calls, no cloud dependenciesβ€”just raw computational power exposed directly to your local AI.

✨ Why this MCP?

Over 120+ specialized frontend engineering utilities from devtoolsonline.dev are currently being ported to be completely native to your AI. With a single configuration line, your Agent learns exactly how to fix broken JSON, decode JWTs, generate strong passwords, parse epochs, and more perfectly on the first try.


πŸ› οΈ Available Tools

Tool Description Need to know
json_repair Smart auto-fixing for heavily broken JSON syntax Handles trailing commas, wrong/missing quotes, unescaped chars
json_format Prettify and indent valid JSON securely Customizable indent levels
json_validate Validate any string as a JSON document Returns detailed error explanations
jwt_decode Decode JSON Web Tokens Parses Header/Payload and calculates expiration status
string_case Case Converter (camel, snake, kebab, etc.) Fully automated refactoring mapping
unix_timestamp Epoch Time Parser Translate raw ms/sec epochs into human-readable ISO/UTC arrays
url_encode / decode Native Percent-Encoding Escapes complex HTTP strings perfectly
base64_encode / decode Binary-to-Text Encoding schemes Safely encodes blocks of environment data in memory
password_generate Cryptographically Secure Generator Mix case, numbers, symbols with custom length limits
uuid_generate Generates standard UUIDv4 keys Uses node:crypto / WebCrypto safely
text_stats Analyzer for raw text strings Generates word, character, empty space metrics, and reading times
lorem_ipsum Generates raw placeholder text Configurable paragraphs and words
hex_to_rgb / rgb_to_hex Conversion for color formatting Auto-fixes messy CSS # color variables

(More tools are actively being ported from our 128+ Web Collection!)


βš™οΈ Quick Installation (For AI IDEs)

You never have to install this globally. You can bind devtoolsonline-mcp directly to your favorite agent dynamically using npx.

1. Cursor IDE Setup
  1. Open Cursor Settings (Ctrl + Shift + J or Cmd + Shift + J).
  2. Go to Features -> MCP Servers (Or Type 'MCP' in the search bar).
  3. Click + Add new MCP server.
  4. Set name: DevTools
  5. Set Type: command
  6. Set Command: npx -y devtoolsonline-mcp
2. Claude Desktop Setup

Modify your configuration file located at:

  • Windows: %APPDATA%\Claude\claude_desktop_config.json
  • Mac: ~/Library/Application Support/Claude/claude_desktop_config.json
{
  "mcpServers": {
    "devtoolsonline": {
      "command": "npx",
      "args": ["-y", "devtoolsonline-mcp"]
    }
  }
}
3. VS Code (Cline / Roo Code) Setup

Open your global storage MCP Settings file (~/.vscode/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json):

{
  "mcpServers": {
    "devtoolsonline": {
      "command": "npx",
      "args": ["-y", "devtoolsonline-mcp"]
    }
  }
}
4. Zed Editor Setup

Open configuration (Ctrl + , / Cmd + ,) and set:

{
  "mcpServers": {
    "devtoolsonline": {
      "command": "npx",
      "args": ["-y", "devtoolsonline-mcp"]
    }
  }
}

πŸ’‘ Prompting Examples

You do not need to call the MCP manually! Once properly configured, simply talk to the AI using Natural Language Prompts:

πŸ› Syntax Fixing

"I have a python dictionary that I need in JSON format but it's super broken ({ "key": 'value', }). Use your JSON repair tool to fix it into a rigid schema structure."

πŸ” Security & Auth Tokens

"Please decode this JWT token specifically tracking if the payload is expired or not."

βš™οΈ Time Conversions

"I have an epoch reading 1716334581231. Give me what standard time and date that aligns with."

🎨 Design Conversions

"Convert all the #FF5A2X HEX codes inside this React component into specific RGB object literals."


  • Web App: Built with logic powering devtoolsonline.dev.
  • Core Library NPM: Built on top of @devtoolsonline/core.
  • Issues/Requests: Please tweet or reach out if you'd like a specific tool ported to MCP.

Made with ❀️ for developers by developers. MIT License.