figma/mcp-server-guide

figma-create-new-file

Always use this skill when the user wants to create a new Figma Design, FigJam, or Slides file.

소스 보기

사용 방법

  1. 설치 명령을 복사하고 자신의 에이전트 환경에 설치하기 전에 소스 패키지를 확인하세요.
  2. 필요한 도구, 인증 정보, 지원 환경은 원본 문서에서 확인하세요.
  3. 입력과 원하는 산출물을 설명하고 출처와 결과를 대조하세요.
npx skills add https://github.com/figma/mcp-server-guide --skill figma-create-new-file

시작 전 확인

  • 설치에는 모델 구독, API 한도, 파일 접근 권한이 포함되지 않습니다.
  • 별점 수와 설치 수는 활동 지표이며 독립적인 품질·보안 검증이 아닙니다.
원본 Skill 문서

원본 저장소의 제목, 예시, 코드, 표, 링크, 이미지를 유지해 표시합니다.

Create a new file in Figma

Steps to create a new Figma Design, FigJam, or Slides file using the create_new_file MCP tool.

Step 1: Resolve the planKey and editorType

Use the planKey the user provided or selected for this task. Otherwise, call whoami and inspect the returned plans.

  • No plans: inform the user that file creation cannot proceed.
  • One plan: use its key as planKey.
  • Multiple plans: show the available plans, ask the user to select one and then use that plan's key as planKey.

Infer editorType from the requested file type by choosing from the tool's advertised input enum. If unclear, ask the user to specify the file type.

Step 2: Call createnewfile

Call the create_new_file tool with all three required arguments:

  • fileName: Required. Choose a concise name if the user does not provide one.
  • planKey: Required. Use the planKey resolved in Step 1.
  • editorType: Required. Use the editorType selected in Step 1.
  • projectId: Optional. Set it to create the file in a specific project.
json
{
  "fileName": "Quarterly planning",
  "planKey": "team::1234567890",
  "editorType": "design"
}
  • Use the file_key from the create_new_file tool response for subsequent tool calls like use_figma.

Step 3: (Slides only) Handle the empty grid

A new Slides file contains no slides: figma.getSlideGrid() returns []. Before reading properties such as theme tokens from a slide, call figma.createSlide() or handle the empty case. The first createSlide() call automatically creates row 0 and inserts the slide.

관련 작업

같은 저장소의 Skills

더 많은 Skills

모든 Skills
figma
공식

figma-design-to-code

MANDATORY prerequisite — you MUST invoke this skill BEFORE calling the getdesigncontext Figma MCP tool. You MUST trigger this skill whenever the user wants to implement, build, port, or code up a Figma design as code. Example prompts (not exhaustive) are 'implement this Figma design', 'build this screen from Figma', 'turn this Figma into code', 'design to code'. This skill provides critical instructions and steps to the agent on how to correctly implement Figma designs in code and must NOT be sk

설치 수
2
GitHub Stars
2.1천
업데이트
10월 20일
figma
공식

figma-code-connect

Creates and maintains Figma Code Connect template files that map Figma components to code snippets. Use when the user mentions Code Connect, Figma component mapping, design-to-code translation, or asks to create/update .figma.ts or .figma.js files.

설치 수
4
GitHub Stars
2.1천
업데이트
10월 19일
figma
공식

figma-code-workflows

Import or upload local HTML or project files into Figma, choose editable Design frames, runnable Code Layers or standalone Code (also known as Make), and repair imported previews. Use only when the user explicitly names editable Design layers, a runnable Code Layer, or a standalone Code/Make file, or supplies a Figma file key/link as the import destination. Generic code or code-component requests need output clarification before using this workflow.

설치 수
4
GitHub Stars
2.1천
업데이트
10월 19일
figma
공식

figma-generate-design

Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma', 'create in Figma from code', 'push page to Figma', 'take this app/page and build it in Figma', 'create a screen', 'build a landing page in Figma', 'update the Figma screen to match code', 'convert this modal/dialog/drawer/panel to Figma'. This is the preferred workflow skill whenever the user wants to build or update a full page, modal,

설치 수
5
GitHub Stars
2.1천
업데이트
10월 19일