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

# superun 文檔 - 聊出你的產品

> 做產品，就用 superun AI。使用 superun AI 快速創建應用和網站，支持一鍵創建，無需編程，智能生成專業應用和網站。支持代碼模式和可視化編輯，適合任何技能水平的用戶。

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

<div
  style={{
maxWidth: '1200px',
margin: '0px auto',
padding: '3rem 2rem',
minHeight: '100vh',
display: 'flex',
flexDirection: 'column',
justifyContent: 'flex-start',
alignItems: 'center'
}}
>
  <div
    style={{ 
textAlign: 'center', 
marginBottom: '4rem', 
position: 'relative',
width: '100%',
maxWidth: '800px'
}}
  >
    <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: '3.5rem', 
    fontWeight: '700', 
    marginBottom: '1rem', 
    textAlign: 'center', 
    position: 'relative', 
    display: 'block',
    width: '100%',
    background: 'linear-gradient(135deg, #16A34A 0%, #07C983 100%)',
    WebkitBackgroundClip: 'text',
    WebkitTextFillColor: 'transparent',
    backgroundClip: 'text',
    wordBreak: 'keep-all',
    overflowWrap: 'break-word',
    lineHeight: '1.2'
  }}
    >
      <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" style={{ display: 'inline-block' }}>superun 文檔</span>
    </h1>

    <p
      className="text-gray-600 dark:text-gray-400"
      style={{ 
  fontSize: '1.375rem', 
  marginTop: '1.5rem', 
  marginBottom: '2rem',
  lineHeight: '1.7',
  maxWidth: '600px',
  margin: '1.5rem auto 2rem'
}}
    >
      做產品，就用 superun AI。使用 superun AI 快速創建應用和網站，支持一鍵創建，無需編程，智能生成專業應用和網站。
    </p>

    <div
      style={{ 
  display: 'flex', 
  gap: '1rem', 
  justifyContent: 'center',
  flexWrap: 'wrap',
  marginTop: '2rem'
}}
    >
      <a href="/zh-Hant/superun/introduction/welcome" className="inline-flex items-center px-6 py-3 rounded-lg font-medium text-white bg-primary hover:bg-primary-dark transition-colors shadow-sm hover:shadow-md" style={{ textDecoration: 'none' }}>
        開始使用
      </a>

      <a href="https://superun.com/" target="_blank" rel="noopener noreferrer" className="inline-flex items-center px-6 py-3 rounded-lg font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors" style={{ textDecoration: 'none' }}>
        訪問 superun.com
      </a>
    </div>
  </div>

  <div
    style={{ 
display: 'grid', 
gridTemplateColumns: 'repeat(auto-fit, minmax(320px, 1fr))', 
gap: '1.5rem', 
width: '100%', 
maxWidth: '1100px'
}}
  >
    <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 transition-all hover:shadow-lg" href="/zh-Hant/superun/introduction/welcome">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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 transition-all hover:shadow-lg" href="/zh-Hant/superun/features/modes">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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 transition-all hover:shadow-lg" href="/zh-Hant/superun/integrations/introduction">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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 transition-all hover:shadow-lg" href="/zh-Hant/superun/tips-tricks/best-practice">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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 transition-all hover:shadow-lg" href="/zh-Hant/superun/use-case/inspiration-showcase">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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 transition-all hover:shadow-lg" href="/zh-Hant/superun/changelog">
      <div className="px-6 py-6 relative">
        <div style={{ display: 'flex', alignItems: 'center', gap: '0.75rem', marginBottom: '0.75rem' }}>
          <div className="h-8 w-8 bg-primary dark:bg-primary-light rounded-lg flex items-center justify-center" 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-lg 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>
</div>