카테고리 없음

Cursor + Figma MCP 가이드 - Figma API 토큰 발급하기

퇴근하고싶은 2025. 10. 29. 09:00

API 토큰이란?

API 토큰은 일종의 "디지털 열쇠"입니다. Cursor가 여러분의 Figma 디자인을 읽을 수 있도록 허가하는 비밀번호 같은 것이죠. 마치 집 열쇠를 복사해서 친구에게 주면 친구가 우리 집에 들어올 수 있는 것처럼, API 토큰을 Cursor에게 제공하면 Cursor가 Figma 파일을 읽을 수 있게 됩니다.

왜 필요한가요?

  • Cursor와 Figma를 연결하기 위해 반드시 필요합니다
  • 토큰 없이는 Cursor가 Figma 파일에 접근할 수 없습니다
  • 보안을 유지하면서 특정 권한만 부여할 수 있습니다

Step 1: Figma 설정 페이지 접속하기

1-1. Figma 실행

  1. Figma 데스크톱 앱을 실행합니다
  2. 로그인이 되어 있는지 확인합니다

1-2. 설정 메뉴 열기

방법 1: 프로필 메뉴에서 접속

  1. 화면 좌측 하단의 프로필 아이콘 (사용자 이름 또는 아바타) 클릭
  2. 드롭다운 메뉴가 나타나면 "Settings" 클릭

방법 2: 직접 URL 접속

  1. 웹 브라우저에서 다음 주소로 이동:
 
   https://www.figma.com/settings

1-3. Security 탭으로 이동

  1. 설정 페이지가 열리면 상단 탭 메뉴를 확인합니다
  2. "Security" 탭을 클릭합니다
  3. 페이지를 아래로 스크롤합니다

Step 2: API 토큰 생성하기

2-1. Personal Access Tokens 섹션 찾기

  1. Security 페이지를 아래로 스크롤하면
  2. "Personal access tokens" 섹션이 나타납니다
  3. 여기서 API 토큰을 생성하고 관리할 수 있습니다

2-2. 새 토큰 생성

  1. "Generate new token" 또는 "Create a new personal access token" 버튼을 클릭합니다
  2. 토큰 생성 다이얼로그가 나타납니다

2-3. 토큰 이름 입력

  1. "Token name" 필드에 토큰의 이름을 입력합니다
    • 예: Cursor MCP Integration
    • 예: Cursor Access Token
    • 예: For Cursor AI
  2. 나중에 어떤 용도로 만든 토큰인지 알 수 있도록 명확한 이름을 지어주세요

2-4. 토큰 권한 설정 (Scopes)

토큰에 어떤 권한을 줄지 선택해야 합니다. 다음 항목들을 체크하세요:

필수 권한 (반드시 체크해야 함):

  • ☑️ File content - Read only: 파일 내용 읽기 (가장 중요!)
  • ☑️ Dev resources - Read only: 개발 리소스 읽기

선택 권한 (필요에 따라 체크):

  • File variables: 변수 접근 (색상, 폰트 변수 등 사용 시)
  • Comments: 코멘트 접근 (필요하면 체크)

⚠️ 중요: "Write" 권한은 체크하지 마세요! Cursor는 읽기만 하면 되므로 보안을 위해 쓰기 권한은 주지 않는 것이 좋습니다.

2-5. 토큰 생성 완료

  1. 권한 설정을 완료했으면 "Generate token" 버튼을 클릭합니다
  2. 짧은 로딩 후 토큰이 생성됩니다
  3. 생성된 토큰이 화면에 표시됩니다

Step 3: 토큰 안전하게 보관하기

3-1. 토큰 복사하기

생성된 토큰은 다음과 같은 형태로 표시됩니다:

figd_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

⚠️ 중요! 이 토큰은 단 한 번만 표시됩니다!

  1. 토큰 옆의 "Copy token" 버튼을 클릭하거나
  2. 토큰 텍스트를 마우스로 드래그해서 선택하고 Ctrl + C로 복사합니다

🚨 경고: 이 화면을 닫으면 토큰을 다시 볼 수 없습니다! 반드시 지금 복사해두세요!

3-2. 메모장에 임시 저장하기

  1. Windows 시작 메뉴에서 "메모장" 검색 후 실행
  2. 복사한 토큰을 메모장에 붙여넣기 (Ctrl + V)
  3. 다음 정보도 함께 적어둡니다:
 
   Figma API Token
   생성일: 2025년 10월 27일
   용도: Cursor MCP 연동
   토큰: figd_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
  1. 파일을 **"figma_token.txt"**라는 이름으로 저장합니다
    • 저장 위치: 문서 폴더 (C:\Users\사용자이름\Documents)

3-3. 토큰 저장 확인

  1. "Done" 또는 "I've saved my token" 버튼을 클릭합니다
  2. Personal access tokens 목록에 방금 만든 토큰이 나타납니다
  3. 토큰의 전체 값은 보이지 않고, 이름과 생성 날짜만 표시됩니다

Step 4: 토큰 보안 가이드

4-1. 하지 말아야 할 것 ❌

  • GitHub, GitLab 등 공개 저장소에 업로드하지 마세요
  • 다른 사람과 공유하지 마세요
  • SNS, 블로그 등에 게시하지 마세요
  • 스크린샷을 찍어서 공유하지 마세요
  • 이메일로 전송하지 마세요

4-2. 해야 할 것 ✅

  • 로컬 컴퓨터의 안전한 위치에 저장하세요
  • 텍스트 파일로 저장할 때는 암호화된 폴더에 보관하세요
  • 정기적으로 토큰을 재생성하세요 (3-6개월마다)
  • 더 이상 사용하지 않는 토큰은 삭제하세요

4-3. 토큰이 유출되었다면?

만약 실수로 토큰을 공개했거나 유출이 의심된다면:

  1. 즉시 Figma 설정 페이지로 이동
  2. Security > Personal access tokens
  3. 해당 토큰 옆의 "Delete" 버튼 클릭
  4. 새로운 토큰을 다시 생성합니다

Step 5: 토큰 관리하기

5-1. 토큰 목록 확인

  1. Figma 설정 > Security > Personal access tokens
  2. 생성된 모든 토큰의 목록을 볼 수 있습니다
  3. 각 토큰에는 다음 정보가 표시됩니다:
    • 토큰 이름
    • 생성 날짜
    • 마지막 사용 날짜

5-2. 토큰 삭제

사용하지 않는 토큰은 삭제하는 것이 좋습니다:

  1. 삭제할 토큰 찾기
  2. 토큰 옆의 "..." (더보기) 버튼 클릭
  3. "Delete" 선택
  4. 확인 다이얼로그에서 "Delete" 다시 클릭

5-3. 새 토큰 추가 생성

필요하면 여러 개의 토큰을 만들 수 있습니다:

  • 각 프로젝트별로 다른 토큰 사용
  • 각 도구별로 다른 토큰 사용 (Cursor용, 다른 앱용 등)
  • 이렇게 하면 보안 관리가 더 용이합니다

Step 6: 토큰 테스트하기 (선택사항)

토큰이 제대로 작동하는지 간단히 테스트해볼 수 있습니다.

6-1. PowerShell 열기

  1. Windows 키를 누릅니다
  2. "PowerShell" 입력
  3. "Windows PowerShell" 클릭

6-2. API 요청 테스트

다음 명령어를 입력합니다 (YOUR_TOKEN 부분을 실제 토큰으로 교체):

 
 
powershell
$headers = @{
    'X-Figma-Token' = 'YOUR_TOKEN'
}
Invoke-WebRequest -Uri 'https://api.figma.com/v1/me' -Headers $headers

결과 확인:

  • 성공하면 사용자 정보(이름, 이메일 등)가 JSON 형태로 표시됩니다
  • 실패하면 "Invalid token" 같은 오류 메시지가 나타납니다

💡 참고: 이 테스트는 선택사항입니다. 나중에 Cursor 연동 시 자동으로 확인됩니다.

토큰 관련 문제 해결

문제 1: 토큰을 복사하지 못했어요

해결방법: 토큰을 다시 생성하세요

  1. 기존 토큰 삭제
  2. Step 2로 돌아가서 새 토큰 생성
  3. 이번에는 반드시 복사해서 저장하세요!

문제 2: 토큰이 작동하지 않아요

체크리스트:

  • ✅ 토큰을 정확히 복사했나요? (앞뒤 공백 없이)
  • ✅ "File content - Read only" 권한을 체크했나요?
  • ✅ 토큰을 삭제하지는 않았나요?

문제 3: 토큰을 어디에 저장했는지 잊어버렸어요

해결방법:

  1. 기존 토큰은 보안을 위해 삭제
  2. 새 토큰을 생성
  3. 이번에는 문서 폴더의 명확한 위치에 저장하세요

체크리스트: 3편 완료 확인

다음 항목을 모두 완료했는지 확인하세요:

  • Figma 설정 페이지에 접속했다
  • Personal access tokens 섹션을 찾았다
  • 새 토큰을 생성했다
  • 토큰 이름을 입력했다 (예: Cursor MCP Integration)
  • 필수 권한을 체크했다 (File content - Read only)
  • 토큰을 복사했다
  • 토큰을 메모장에 안전하게 저장했다
  • 토큰 파일을 문서 폴더에 저장했다
  • 토큰 보안 가이드를 읽었다
반응형