Figma MCP × Cursor Ͱ࣮ݱ͢Δ ࠷ڧσβΠϯˠίʔυม׵ϫʔΫϑϩʔ ;ΈϖϯˏCursorAIݚڀॴ 2025೥1 ⽉ 

͸͡Ίʹ ͜ͷൃදͰղܾͰ͖Δ໰୊ ʮσβΠφʔ͔ΒFigmaͰड͚औͬͨσβΠϯΛɺ஧࣮ʹίʔυʹམͱ͠ࠐΉͷʹ࣌ؒ ͕͔͔Γ͗͢Δ...ʯ ͦΜͳ೰ΈΛ๊͑ΔϓϩάϥϚʔͷ ⽅ ʹ޲͚ͨ಺༰Ͱ͢ɻ 

͜ͷൃදͰಘΒΕΔޮՌ • FigmaσβΠϯΛ௚઀CursorͰಡΈࠐΜͰίʔυ ⽣ ੒Ͱ͖ΔΑ͏ʹͳΔ • σβΠφʔͱͷमਖ਼΍ΓऔΓ͕࠷ ⼩ ݶʹͳΔ • ॳظίʔυ ⽣ ੒ޙɺAIͱͷର࿩Ͱ100%͍ۙ׬੒౓·Ͱ͍͚࣋ͬͯΔ • Stagewiseͱͷ࿈ܞͰɺ͞Βʹ௚ײతͳमਖ਼͕ՄೳʹͳΔ 

ैདྷͷ։ൃϑϩʔͷ՝୊ Α͋͘Δ ⾮ ޮ཰ͳϫʔΫϑϩʔ 1. σβΠφʔ͔ΒFigmaσβΠϯΛड͚औΔ 2. σβΠϯΛ ⾒ ͳ͕Β ⼿ ࡞ۀͰNext.jsͰίʔυΛॻ͘ 3. ΫϥΠΞϯτ͔Βʮ͜ͷ ⾊ Λม͑ͯʯʮυϩοϓμ΢ϯͷಈ͖Λม͑ͯʯͱमਖ਼ґ པ 4. ࠶౓ ⼿ ࡞ۀͰमਖ਼...ແݶϧʔϓ ݁Ռɿ1ͭͷը ⾯ Λ׬੒ͤ͞Δͷʹ਺͔࣌ؒΒ1 ⽇ ͔͔Δ 

໰୊ͷࠜຊݪҼ • σβΠϯͷղऍʹ͕͔͔࣌ؒΔ FigmaΛ ⾒ ͳ͕ΒCSSͷmargin΍paddingΛਪଌ • मਖ਼ͷͨͼʹ ⼿ ࡞ۀ σβΠφʔͱͷೝࣝζϨͰԿ౓΋मਖ਼ • ΠϯλϥΫςΟϒཁૉͷ࣮૷͕ࠔ೉ υϩοϓμ΢ϯ΍ϞʔμϧͷڍಈΛਖ਼֬ʹ࠶ݱ͢Δͷʹ͕͔͔࣌ؒΔ 

ͳͥFigma MCP × Cursor͕ඞཁͳͷ͔ ैདྷπʔϧͱͷܾఆతͳҧ͍ ⼀ ൠతͳσβΠϯˠίʔυม׵πʔϧ͸ɺ੩తͳ ⾒ ͨ ⽬ ͔͠࠶ݱͰ͖·ͤΜ ͔͠͠ɺFigma MCP͸ҟͳΓ·͢ɿ • ΠϯλϥΫςΟϒཁૉ΋ਖ਼֬ʹಡΈऔΔ • σβΠϯͷҙਤΛཧղ • Cursorͱͷ׬ᘳͳ࿈ܞ 

ղܾࡦɿஈ֊త׬੒౓Ξοϓઓུ ޮ཰తͳ3ஈ֊ϫʔΫϑϩʔ ϑΣʔζ1ɿॳظίʔυ ⽣ ੒ʢ׬੒౓60%ʣ Figma MCPͰσβΠϯΛಡΈࠐΈɺجຊతͳϨΠΞ΢τͱίϯϙʔωϯτΛ ⽣ ੒ ϑΣʔζ2ɿAIର࿩Ͱͷਫ਼៛Խʢ׬੒౓90%ʣ Cursorͱͷ4ʙ5ճͷର࿩Ͱɺࡉ͔͍ௐ੔ͱػೳ࣮૷ ϑΣʔζ3ɿStagewiseͰͷ࠷ऴௐ੔ʢ׬੒౓100%ʣ ϏδϡΞϧΤσΟλͰ௚ײతͳඍௐ੔ 

ޮՌ ैདྷͷ1/3ͷ࣌ؒͰ ⾼ ඼࣭ͳίʔυΛ ⽣ ੒ ͜ͷ3ஈ֊ͷΞϓϩʔνʹΑΓɺ։ൃ࣌ؒΛ ⼤ ෯ʹ୹ॖͰ͖·͢ɻ 

࣮ફνϡʔτϦΞϧ AI Document SummarizerΛ࡞ͬͯΈΑ͏ ࠓճ࣮૷͢ΔσβΠϯͷཁૉɿ • ϔομʔλΠτϧɿϝΠϯλΠτϧͱαϒλΠτϧ • AIϞσϧબ୒υϩοϓμ΢ϯɿGPT-4ɺClaude 3ɺGemini Pro͔Βબ୒ • ϑΝΠϧΞοϓϩʔυྖҬɿυϥοά&υϩοϓରԠ • ࣮ ⾏ ϘλϯɿʮSummarize Documentʯ 

εςοϓ1ɿFigma MCPͷઃఆ Framelink Figma MCP ServerΛ࢖ ⽤ 1-1. Figma APIτʔΫϯͷऔಘ FigmaͷϗʔϜϖʔδ͔Βɺࠨ্ͷϓϩϑΟʔϧΞΠίϯΛΫϦοΫ υϩοϓμ΢ϯ͔ΒʮSettingsʯΛબ୒ ʮSecurityʯλϒΛબ୒ ʮPersonal access tokensʯͰτʔΫϯΛ ⽣ ੒ 

εςοϓ2ɿॳظίʔυ ⽣ ੒ Figma MCPͰσβΠϯΛಡΈࠐΈ 1. FigmaͷURL͔ΒϑΝΠϧΩʔΛऔಘ 2. CursorͰҎԼͷίϚϯυΛ࣮ ⾏ ɿ このFigmaデザインをReact + Tailwind で実装してください ݁Ռɿ໿60%׬੒౓ͷUI جຊϨΠΞ΢τ͸׬੒ ࡉ෦͸ௐ੔͕ඞཁ 

εςοϓ3ɿAIͱͷର࿩Ͱਫ਼៛Խ ⽣ ੒͞ΕͨίʔυΛݩʹվળ 生成されたコードを確認しました。以下の点を修正してください： Select AI Model は左寄せでよろしくお願いします ͜ͷஈ֊Ͱͷվળɿ վળ͞ΕͨUIϓϨϏϡʔ ϨΠΞ΢τ͕FigmaσβΠϯʹΑΓ͍ۙͮͨঢ়ଶ جຊతͳΠϯλϥΫγϣϯ͕࣮૷͞Εͨঢ়ଶ 

εςοϓ4ɿStagewiseͰͷ࠷ऴௐ੔ ࢹ֮తͳඍௐ੔Λ ⾏ ͏ 1. Cursorͷ֦ுػೳ͔ΒʮstagewiseʯͰݕࡧ 2. ্ͷλϒͰ >setuptoolbar Λ ⼊ ⼒ 3. stagewiseΛݱࡏͷίʔυʹಋ ⼊ 4. मਖ਼ՕॴΛબ୒ͯ͠ௐ੔ ࠷ऴతʹ100%ͷ׬੒౓Λ࣮ݱ 

τϥϒϧγϡʔςΟϯά Α͋͘Δ໰୊ͱղܾࡦ ໰୊1ɿMCP઀ଓΤϥʔ͕ൃ ⽣ ͢Δ ղܾࡦɿ APIτʔΫϯͷ֬ೝ ݖݶͷ֬ೝʢFile contentͱDev resourcesͷಡΈऔΓݖݶʣ Cursorͷ࠶ىಈ ωοτϫʔΫ؀ڥͷ֬ೝ 

τϥϒϧγϡʔςΟϯάʢଓ͖ʣ ໰୊2ɿॳظ ⽣ ੒ͷਫ਼౓͕ظ଴ΑΓ௿͍ ղܾࡦɿ FigmaσβΠϯͷ࠷దԽɿϨΠϠʔߏ଄Λ੔ཧ͠ɺҙຯͷ͋Δ໊લΛ෇͚Δ ίϯϙʔωϯτԽɿ࠶ར ⽤ ͞ΕΔཁૉΛίϯϙʔωϯτԽ ໌ ⽰ తͳπʔϧࢦఆɿget_codeπʔϧΛ࢖ͬͯɺ͜ͷϑϨʔϜΛReact + Tailwind Ͱ࣮૷͍ͯͩ͘͠͞ 

·ͱΊ Figma MCP × CursorͷޮՌ • ։ൃ࣌ؒΛ ⼤ ෯୹ॖɿैདྷͷ1/3ͷ࣌ؒͰ࣮૷Մೳ • ⾼ ඼࣭ͳίʔυ ⽣ ੒ɿσβΠϯʹ஧࣮ͳ࣮૷ • ஈ֊తͳ׬੒౓޲্ɿ60% → 90% → 100%ͷ3ஈ֊Ξϓϩʔν • σβΠφʔͱͷ࿈ܞվળɿमਖ਼΍ΓऔΓ͕࠷ ⼩ ݶʹ 

ࠓޙͷల๬ ͞ΒͳΔՄೳੑ • ΑΓෳࡶͳΠϯλϥΫγϣϯͷ ⾃ ಈ࣮૷ • σβΠϯγεςϜͱͷ࿈ܞڧԽ • νʔϜ։ൃͰͷޮ཰Խ • ϓϩτλΠϓ͔Βຊ൪ίʔυ΁ͷ௚઀ม׵ 

ࢀߟࢿྉ • Framelink Figma MCPެࣜΨΠυ • Figma MCP࠷৽৘ใʢGLips/Figma-Context-MCPʣ • Figma Dev Mode MCPެࣜυΩϡϝϯτ • Cursor MCPઃఆϚχϡΞϧ 

ँࣙ ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ ࣭໰ɾσΟεΧογϣϯͷ࣌ؒ Figma MCP × CursorΛ࢖ͬͨ։ൃମݧʹ͍ͭͯɺ ͥͻ͝ҙ ⾒ Λ͓ฉ͔͍ͤͩ͘͞ʂ