Qoder에서 Curio 사용하기

Qoder에 추가되는 기능

Curio는 Model Context Protocol(MCP) 서버를 운영합니다. Qoder를 연결하면 라이브러리를 검색하고 스타일 메타데이터를 읽으며 지금 만드는 것에 필요한 전체 디자인 사양(색 역할, 글자 크기 체계, 여백 리듬, 형태, 그림자, 모션)을 가져올 수 있습니다.

Qoder 공식 문서는 URL로 설정하는 streamable HTTP MCP 서버를 지원한다고 밝히고 있어 Curio는 항목 하나면 충분하고 로컬 프로세스가 필요 없습니다. 설정조차 하고 싶지 않다면 공유 링크를 대화창에 붙여넣으세요.

공유 링크 복사

가장 빠른 방법이며 설정이 전혀 필요 없습니다. 모든 스타일 페이지에서 15분 동안 유효한 링크를 발급할 수 있으니, 바꾸고 싶은 내용과 함께 대화창에 붙여넣으세요.

1. 1

   스타일 고르기

   갤러리에서 원하는 스타일의 페이지를 엽니다. 모든 스타일에는 전체 미리보기가 있는 전용 페이지가 있습니다.

   

2. 2

   “Hand off to My AI”를 누르고 사용 중인 AI 고르기

   버튼을 누르면 AI 클라이언트 목록이 열립니다. 사용 중인 것을 고르세요 — Claude, ChatGPT, Gemini, WorkBuddy, Qoder, DeepSeek, Kimi 등이 있습니다. 하나를 골라야 아래 복사 버튼이 활성화됩니다.

   

3. 3

   링크를 복사해 AI에 붙여넣기

   Curio가 링크를 발급해 바로 쓸 수 있는 프롬프트와 함께 복사합니다. 대화창에 그대로 붙여넣고 무엇을 바꾸고 싶은지만 덧붙이면 됩니다.

   

패널에 사용 중인 클라이언트가 없다면 아무 카드나 고르세요. 복사되는 링크와 프롬프트는 동일하며, 선택은 버튼을 활성화하는 역할만 합니다. 링크를 발급하면 해당 스타일의 전체 사양이 열리며 크레딧 1개가 차감되고, 15분 안에 같은 스타일을 다시 복사하면 재사용되어 추가 비용이 들지 않습니다.

MCP로 연결

1. 1

   Qoder MCP 설정 열기

   오른쪽 위 사용자 아이콘을 클릭해 「Qoder 设置」(설정)을 열고 왼쪽에서 MCP를 선택합니다.

2. 2

   Curio 서버 추가

   「我的服务」(내 서비스) 탭에서 「+ 添加」(추가)를 클릭하고 이름은 curio, URL은 https://mcp.designbycurio.com/mcp인 mcpServers 설정을 붙여넣습니다. Qoder가 URL로 streamable HTTP를 인식하므로 type은 필요 없습니다.

3. 3

   로그인하고 도구 확인

   저장하고 로그인을 마칩니다. 링크 아이콘이 서비스 준비 완료를 표시하면 펼쳐서 Curio의 도구 목록을 확인하세요. Free는 무료 스타일을, Pro나 Max는 전체 라이브러리를 사용할 수 있습니다.

4. 4

   스타일로 UI 만들기

   Qoder에 Curio 스타일을 찾아 그 스타일로 만들라고 요청하세요. 전체 사양을 가져와 해당 스타일의 정확한 토큰과 규칙대로 컴포넌트를 작성합니다.

What you get

일관된 결과: Qoder가 생성하는 모든 컴포넌트는 하나의 기준 사양을 바탕으로 같은 모습을 유지합니다.

내력이 있는 스타일입니다. 무작위 팔레트 생성기가 아니라 사조, 브랜드, 전통에서 왔습니다.

유지 비용이 없습니다. 디자인 시스템 저장소를 쓰거나 검토하거나 맞출 필요가 없습니다.

Example prompts

Curio에서 절제된 스위스 스타일을 찾아 그 스타일로 이 설정 페이지를 다시 만들어 주세요.

Apply this Curio design style to the whole component library: <paste share link>.

FAQ