Install
npx -y @microcharts/mcp누구에게 맞나
모델이 단어 크기 차트를 고르고 접속 방법을 알아내며 실제 alt text가 있는 SVG로 렌더하게 하려는 사람을 위한 것이다. 공식 문구는 An MCP server and Vercel AI-SDK toolset for microcharts — let a model find the right word-sized chart, get exactly how to wire it, and render it to a finished SVG with real alt text다. 제품 페이지: https://microcharts.dev/
전제: 이 기기에서 npx를 쓸 수 있고 공식 JSON으로 @microcharts/mcp를 클라이언트에 더한다. 지목 위치는 Claude Desktop의 claude_desktop_config.json 또는 Cursor의 .cursor/mcp.json이다.
공식은 또한 Runs on your machine, stdio server, distributed on npm, Nothing is hosted; no account, no key, no data leaves라고 쓴다. 그래도 위험이 0은 아니다. 프로세스는 이 기기에서 돌고 렌더를 위해 넘긴 시계열을 읽는다. 프라이버시 경계가 없다고 이해하지 마라.
3분 만에 첫 시도
npx -y @microcharts/mcp만 따른다. 설정은 command가 npx, args가 -y와 @microcharts/mcp다. 호스티드 엔드포인트를 따로 열지 마라.
전제: 위 설정 파일 둘 중 하나를 쓸 수 있다. 공식 설명은 계정이나 키를 요구하지 않는다.
설치와 실행 위치: Claude Desktop은 claude_desktop_config.json, Cursor는 .cursor/mcp.json. 서버 이름은 microcharts다.
낮은 위험 관찰: 먼저 리소스 microcharts://catalog(every chart + metadata)를 읽는다. 공식 발췌는 find, get, render를 능력으로 쓰고 도구 함수 이름은 없다. 처음에는 카탈로그 리소스만 읽고 함수 이름을 만들지 마라.
성공 신호: 차트 카탈로그와 metadata를 보는 것이다. 공식 설명은 카탈로그 필드를 나열하지 않았다.
사용 사례
사례 1: 카탈로그를 본다. microcharts://catalog를 읽어 어떤 단어 크기 차트가 있고 metadata가 무엇인지 확인한다. 읽기만 하고 시계열을 넣지 마라.
사례 2: 완성 SVG를 렌더한다. 공식은 Render to a finished, self-contained SVG plus its generated alt text라고 쓴다. 시계열은 data에 두고 다른 props는 value, target, curve, color, width를 포함한다. 호출 전에 이 수가 그리려는 값인지 확인한다. 리소스 microcharts://agent-setup도 있으며 the prompt for wiring microcharts into a codebase다. 그것은 접속 프롬프트이지 렌더 자체가 아니다.
사용 한계
렌더는 SVG와 alt text를 만든다. 공식 설명은 저장 경로나 실행 취소를 쓰지 않았다. find / get / render는 함수 이름으로 나오지 않았다. 호출 이름 세트를 스스로 보태지 마라.
공식 입구: https://github.com/ganapativs/microcharts/tree/main/packages/mcp