Back to Directory/Media & Images

Chromium Style QR Code Generator

MCP server for generating Chromium-style QR codes with optional Dino logo or custom center image

Media & ImagesTypeScriptv1.0.2

@chromium-style-qrcode/mcp

中文文档

An MCP (Model Context Protocol) server for generating Chromium-style QR codes with circular modules, rounded locators, and an optional center image (Dino logo or custom).

Features

  • Chromium-style rendering — circular dot modules, rounded locator corners, matching the QR codes generated by Google Chrome
  • Dino logo — the iconic Chrome Dino is drawn in the center by default
  • Custom center image — supply a Base64-encoded image to replace the Dino
  • Toggle center image — set showLogo: false to generate a plain QR code
  • MCP-native — communicates over stdio, works with any MCP-compatible client

Installation

Note: The type: "stdio" field is not required — it's the default transport for MCP servers configured with command and args.

Using npx (recommended)

No installation required:

{
  "mcpServers": {
    "io.github.chromium-style-qrcode/mcp": {
      "command": "npx",
      "args": ["-y", "@chromium-style-qrcode/mcp"]
    }
  }
}

Using bunx

{
  "mcpServers": {
    "io.github.chromium-style-qrcode/mcp": {
      "command": "bunx",
      "args": ["@chromium-style-qrcode/mcp"]
    }
  }
}

Global install

npm install -g @chromium-style-qrcode/mcp

Then configure the MCP client:

{
  "mcpServers": {
    "io.github.chromium-style-qrcode/mcp": {
      "command": "chromium-style-qrcode-mcp"
    }
  }
}

Tool

generate_qr_code

Generate a Chromium-style QR code and return it as a PNG image.

Parameters
ParameterTypeRequiredDefaultDescription
textstringYes—The text or URL to encode
showLogobooleanNotrueWhether to show a center logo
customLogostringNo—Base64-encoded image to use as the center logo instead of the Dino
Examples

Basic QR code with Dino logo:

{
  "text": "https://example.com"
}

Plain QR code (no center image):

{
  "text": "https://example.com",
  "showLogo": false
}

QR code with custom center image:

{
  "text": "https://example.com",
  "customLogo": "<base64-encoded image data>"
}

Development

# Install dependencies
bun install

# Run in development
bun run start

# Build
bun run build

# Lint & format
bun run lint
bun run format

Requirements

  • Node.js >= 22.14.0

License

MIT

Installation

Source-derived launch command. Check the maintainer’s required arguments and credentials before running:

bash
npx -y @chromium-style-qrcode/mcp

Set up in your AI client

Merge this template into ~/Library/Application Support/Claude/claude_desktop_config.json. Keep existing servers. Add any arguments, credentials, and permissions required by the maintainer; this template has not been install-tested.

json
{
  "mcpServers": {
    "io-github-chromium-style-qrcode-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@chromium-style-qrcode/mcp"
      ]
    }
  }
}

Restart Claude Desktop completely for changes to take effect. Confirm the server appears connected in the client’s tool list, then try a read-only example from its documentation.

Claude Desktop setup reference

Package

@chromium-style-qrcode/mcpnpm

Compatible MCP Clients

Chromium Style QR Code Generator works with any MCP-compatible client. Copy the config snippet from the Configuration section above and add it to the file shown for your client, then restart the application.

  • Claude Desktop~/Library/Application Support/Claude/claude_desktop_config.jsonRestart Claude Desktop completely for changes to take effect.
  • Cursor~/.cursor/mcp.jsonRestart Cursor for changes to take effect.
  • VS Code.vscode/mcp.jsonReload VS Code window for changes to take effect.
  • Windsurf~/.codeium/windsurf/mcp_config.jsonRestart Windsurf for changes to take effect.
  • Claude Code.mcp.jsonSave at the project root, then start Claude Code in that project and review the MCP server approval prompt. Keep real credentials out of shared files.

Learn More