> ## 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.

# 文档

> superun.ai 和 Prompt.to.design 的完整产品文件中心,包含入门教程,功能说明,整合指南,使用案例和更新日志,协助你快速掌握由 AI 驱动的应用与网站建置.

<link rel="stylesheet" href="/style.css" />

<meta name="baidu-site-verification" content="codeva-SgtZSfNoqV" />

<div
  style={{
maxWidth: '1200px',
margin: '0px auto',
padding: '2rem',
minHeight: '100vh',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center'
}}
>
  <div style={{ textAlign: 'center', marginBottom: '3rem', position: 'relative' }}>
    <h1 className="whitespace-pre-wrap group font-semibold text-2xl sm:text-3xl mt-8 text-gray-900 dark:text-white" id="documentation" style={{ fontSize: '3rem', fontWeight: '700', marginBottom: '0.5rem', textAlign: 'center', position: 'relative', display: 'inline-block' }}>
      <a href="#documentation" className="absolute -left-12 top-1/2 -translate-y-1/2 flex items-center opacity-0 border-0 group-hover:opacity-100 transition-opacity" aria-label="导航到标题" style={{ left: '-3rem' }}>
        <div className="w-6 h-6 rounded-md flex items-center justify-center shadow-sm text-gray-400 dark:text-white/50 dark:bg-background-dark dark:brightness-[1.35] dark:ring-1 dark:hover:brightness-150 bg-white ring-1 ring-gray-400/30 dark:ring-gray-700/25 hover:ring-gray-400/60 dark:hover:ring-white/20">
          <svg xmlns="http://www.w3.org/2000/svg" fill="gray" height="12px" viewBox="0 0 576 512">
            <path d="M0 256C0 167.6 71.6 96 160 96h72c13.3 0 24 10.7 24 24s-10.7 24-24 24H160C98.1 144 48 194.1 48 256s50.1 112 112 112h72c13.3 0 24 10.7 24 24s-10.7 24-24 24H160C71.6 416 0 344.4 0 256zm576 0c0 88.4-71.6 160-160 160H344c-13.3 0-24-10.7-24-24s10.7-24 24-24h72c61.9 0 112-50.1 112-112s-50.1-112-112-112H344c-13.3 0-24-10.7-24-24s10.7-24 24-24h72c88.4 0 160 71.6 160 160zM184 232H392c13.3 0 24 10.7 24 24s10.7-24 24-24H184c-13.3 0-24-10.7-24-24s10.7-24 24-24z" />
          </svg>
        </div>
      </a>

      <span className="cursor-pointer">文档</span>
    </h1>

    <p className="text-gray-600 dark:text-gray-400" style={{ fontSize: '1.25rem', marginTop: '2.5rem', marginBottom: '2rem' }}>
      superun 和 Prompt.to.design 的产品文档.
    </p>
  </div>

  <h2 className="text-xl font-semibold text-gray-900 dark:text-white mb-4 self-start">
    <a href="https://superun.ai/" target="_blank" rel="noopener noreferrer" className="hover:text-primary dark:hover:text-primary-light transition-colors">
      superun.ai
    </a>
  </h2>

  <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))', gap: '2rem', width: '100%', maxWidth: '920px', marginBottom: '3rem' }}>
    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/introduction/welcome">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/wand-magic.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">入门</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">了解如何创建您的第一个项目,理解核心功能,并开始使用 superun 进行构建.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/features/modes">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/sparkles.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">功能</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">探索 AI 驱动的功能,视觉编辑,代码模式,云集成以及更多功能.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/integrations/introduction">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/plug.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">集成</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">与 Supabase,Resend,AI 模型,Stripe 和其他服务连接,以扩展您的应用程序功能.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/tips-tricks/best-practice">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/lightbulb.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">提示与技巧</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">学习最佳实践,使用图像的技巧,从想法到应用程序的构建以及避免安全隐患.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/use-case/inspiration-time">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/rocket.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">用例</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">探索真实世界的示例,包括登陆页面,原型,SaaS 应用程序和灵感项目.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/superun/changelog">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/clock.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">更新日志</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">随时了解 superun 发布的最新功能,改进和更改.</div>
      </div>
    </a>
  </div>

  <h2 className="text-xl font-semibold text-gray-900 dark:text-white mb-4 self-start">
    <a href="https://www.figma.com/community/plugin/1528325292196938261" target="_blank" rel="noopener noreferrer" className="hover:text-primary dark:hover:text-primary-light transition-colors">
      Prompt.to.design
    </a>
  </h2>

  <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))', gap: '2rem', width: '100%', maxWidth: '920px' }}>
    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/prompt-to-design/guide/welcome">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/wand-magic.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">欢迎</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">AI 驱动的 Figma 插件介绍及其如何融入您的设计工作流程.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/prompt-to-design/features/kick-start">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/sparkles.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">功能</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">探索 Kick Start,风格转换,区域设计,智能填充和修改元素.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/prompt-to-design/pricing/index">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/tags.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">定价</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">包含免费试用和 Plus 计划的简单透明计划.</div>
      </div>
    </a>

    <a className="card block font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden w-full cursor-pointer hover:!border-primary dark:hover:!border-primary-light" href="/zh-Hans/prompt-to-design/changelog">
      <div className="px-6 py-5 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.5rem' }}>
          <div className="h-6 w-6 bg-primary dark:bg-primary-light" style={{maskImage:"url('https://d3gk2c5xim1je2.cloudfront.net/v6.6.0/regular/clock.svg')",maskRepeat:"no-repeat",maskPosition:"center center"}} />

          <h3 className="not-prose font-semibold text-base text-gray-800 dark:text-white">更新日志</h3>
        </div>

        <div className="prose mt-1 text-sm leading-6 text-gray-600 dark:text-gray-400">Prompt.to.design 的版本历史和更新说明.</div>
      </div>
    </a>
  </div>
</div>