.agents/skills/figma-create-new-file/SKILL.md
Create a new blank Figma file. Use when the user wants to create a new Figma design or FigJam file, or when you need a new file before calling use_figma. Handles plan resolution via whoami if needed. Usage — /figma-create-new-file [editorType] [fileName] (e.g. /figma-create-new-file figjam My Whiteboard)
npx skillsauth add ahmadzakiy/skills figma-create-new-fileInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Use the create_new_file MCP tool to create a new blank Figma file in the user's drafts folder. This is typically used before use_figma when you need a fresh file to work with.
This skill accepts optional arguments: /figma-create-new-file [editorType] [fileName]
design (default) or figjamExamples:
/figma-create-new-file — creates a design file named "Untitled"/figma-create-new-file figjam My Whiteboard — creates a FigJam file named "My Whiteboard"/figma-create-new-file design My New Design — creates a design file named "My New Design"Parse the arguments from the skill invocation. If editorType is not provided, default to "design". If fileName is not provided, default to "Untitled".
The create_new_file tool requires a planKey parameter. Follow this decision tree:
User already provided a planKey (e.g. from a previous whoami call or in their prompt) → use it directly, skip to Step 2.
No planKey available → call the whoami tool. The response contains a plans array. Each plan has a key, name, seat, and tier.
key field automatically.key.Call the create_new_file tool with:
| Parameter | Required | Description |
|-------------|----------|-------------|
| planKey | Yes | The plan key from Step 1 |
| fileName | Yes | Name for the new file |
| editorType| Yes | "design" or "figjam" |
Example:
{
"planKey": "team:123456",
"fileName": "My New Design",
"editorType": "design"
}
The tool returns:
file_key — the key of the newly created filefile_url — a direct URL to open the file in FigmaUse the file_key for subsequent tool calls like use_figma.
"design" and "figjam" editor types are supported.use_figma is your next step, load the figma-use skill before calling it.tools
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill to implement designs from Figma nodes or natural language to Vue 3 component or Nuxt pages using Mekari Pixel 3 design system. Requires a working Pixel MCP server connection.
development
Build UIs with @nuxt/ui v4 — 125+ accessible Vue components with Tailwind CSS theming. Use when creating interfaces, customizing themes to match a brand, building forms, or composing layouts like dashboards, docs sites, and chat interfaces.
development
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
tools
**MANDATORY prerequisite** — you MUST invoke this skill BEFORE every `use_figma` tool call. NEVER call `use_figma` directly without loading this skill first. Skipping it causes common, hard-to-debug failures. Trigger whenever the user wants to perform a write action or a unique read action that requires JavaScript execution in the Figma file context — e.g. create/edit/delete nodes, set up variables or tokens, build components and variants, modify auto-layout or fills, bind variables to properties, or inspect file structure programmatically.