> ## Documentation Index
> Fetch the complete documentation index at: https://docs.superun.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# 智能填充

> 使用 Prompt.to.design 中的智能填充功能,自动填充 Figma 设计中的空白区域,AI 生成的内容与您的页面风格相匹配.

import Image from '@/components/Image';

智能填充允许您通过**在选定Frame内自动创建空白部分**来**快速添加新内容**到您的设计中.
您只需选择一个Frame → 输入提示 → 智能填充就会插入与您现有设计相匹配的样式内容块.

***

## 1. 选择 **智能填充** 选项Card

打开 **Prompt.to.design** 插件并点击 **Smart Fill**.\
此模式让 AI 在您选择的Frame内添加新的内容块.

<img src="https://mintcdn.com/uxarts/RSHYLU0ts6AvUQJp/images/smart-fill/1.png?fit=max&auto=format&n=RSHYLU0ts6AvUQJp&q=85&s=8469cc622eb7cdebcd775db384e0936f" alt="打开插件并选择智能填充标签" width={700} data-path="images/smart-fill/1.png" />

***

## 2. 选择要添加新内容的Frame

在您的 Figma 画布上点击一个 **Frame**.
智能填充将自动在此Frame内插入**空部分** - 这是生成新内容的地方.

<img src="https://mintcdn.com/uxarts/I3JOnALDZ5tIGfai/images/smart-fill/2_emptyframe.png?fit=max&auto=format&n=I3JOnALDZ5tIGfai&q=85&s=980ec6a22586cb9dd959dd39516568f5" alt="选择一个Frame;智能填充会自动在其中添加一个空白部分" width={600} data-path="images/smart-fill/2_emptyframe.png" />

***

## 3. 输入描述您想要的新内容的提示

描述您希望智能填充在自动添加的空白部分中生成的内容.

### 示例:"酒店亮点"

> "用"酒店亮点"块填充空白部分,包括:
>
> * 免费无线网络
> * 海港景观
> * 24/7 支持
>
> 匹配现有页面的样式,间距和版式."

<img src="https://mintcdn.com/uxarts/RSHYLU0ts6AvUQJp/images/smart-fill/4.png?fit=max&auto=format&n=RSHYLU0ts6AvUQJp&q=85&s=be44439f9de8ace017309b3232331d1c" alt="输入描述酒店亮点区域的提示" width={350} data-path="images/smart-fill/4.png" />

***

## 4. 生成并查看预览

单击 **生成** 让 AI 创建您的新内容块.
预览将显示一个风格化的"酒店亮点"部分,该部分与Frame的现有设计无缝契合.

<img src="https://mintcdn.com/uxarts/I3JOnALDZ5tIGfai/images/smart-fill/5.png?fit=max&auto=format&n=I3JOnALDZ5tIGfai&q=85&s=c68bec967cbdf677f231fa17985e0ab6" alt="生成的酒店亮点部分的预览" width={700} data-path="images/smart-fill/5.png" />

***

## 5. 将内容插入 Figma

点击 **Insert to Figma** 将生成的区域放置到您选择的Frame中.\
智能填充将用新生成的内容替换它之前创建的空白区域.

僅添加了这个新部分 - Frame的其余部分保持不变.

<img src="https://mintcdn.com/uxarts/I3JOnALDZ5tIGfai/images/smart-fill/6.png?fit=max&auto=format&n=I3JOnALDZ5tIGfai&q=85&s=2d5b348d3b7fa946191d5e5322bab084" alt="将酒店亮点区域插入Frame中" width={900} data-path="images/smart-fill/6.png" />

***

## 概括

智能填充可以帮助您:

* 添加新的内容块,无需手动创建布局
* 让插件自动为您创建一个空白部分
* 保持样式,间距和排版与页面一致
* 立即生成如下部分:
* 亮点
* 特征
* 便利设施
* Info块
* 要点
* 完全使用原生 Figma 图层工作

智能填充非常适合用有意义的,有风格的内容快速扩展页面.

<div
  style={{
marginTop: '2rem',
display: 'flex',
justifyContent: 'center',
}}
>
  <a
    href="https://www.Figma.com/community/plugin/1528325292196938261/prompt-to-design-by-superun-ai-10x-faster-with-ai-design-like-a-pro-prototype-instantly"
    style={{
  backgroundColor: '#0F172A',
  color: 'white',
  padding: '12px 28px',
  borderRadius: '8px',
  fontSize: '16px',
  fontWeight: '600',
  textDecoration: 'none',
  boxShadow: '0 4px 12px rgba(0,0,0,0.08)',
  transition: 'all 0.2s ease',
}}
    onMouseOver="this.style.backgroundColor='#1E293B'"
    onMouseOut="this.style.backgroundColor='#0F172A'"
  >
    开始使用 Prompt.to.design 设计
  </a>
</div>