Back to Plugins
ComponentFiller AI

ComponentFiller AI

Insert the text from the design data into your code

Plugin Preview

ComponentFiller AI preview

About this plugin

ComponentFiller は生成AIを用いて、選択したフレームの原稿と、人間が用意したコンポーネントのコードを組み合わせ、コンポーネントに適切な原稿を入力したコードを返します(要APIキー/Gemini のAPIは無料で取得できます)


利用方法

  1. 利用するAIのAPIを選択
  2. APIキーを入力
  3. 利用する言語と、言語に合わせた基本のプロンプトを設定(任意)
  4. ベースとなるコンポーネントのコードを入力
  5. 利用したいフレームを選択
  6. コードを生成


注意事項:コードを生成するために、選択したAIサービスにデータが送信されます


---


ComponentFiller uses generation AI to combine the script for the selected frame with the component code prepared by humans, and returns a code with the appropriate script entered into the component (API key required).


How to use

  1. Select the AI ​​API to use
  2. Enter the API key
  3. Set the language to use and the basic prompt for the language (optional)
  4. Enter the base component code
  5. Select the frame you want to use
  6. Generate code


Please note: Your data will be sent to the AI ​​service of your choice to generate the code.

Plugin Details

Version5
CreatedMay 7, 2025
Last UpdatedMay 21, 2025
CategorySoftware development
Creatormiral
Stats2 installs, 0 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://api.openai.com
    • https://generativelanguage.googleapis.com