設計解讀
AI 對這套範本設計的解讀：配色、字體、間距、區塊與標誌性細節。使用範本時，Ottermind 會以它為起點。
這份解讀目前還沒有繁體中文版本，先以英文顯示。
- Overall
documentation site, clean and professional, low density, light
- Palette
background #f5f5f5; surfaces #ffffff, #f9f9f9; text #1a1a1a; muted text #666666; primary #0066cc; accents #0099ff, #333333
- Type
headings Inter, 700, uppercase; body Inter, 16px; scale h1 48px, h2 36px, h3 24px
- Shape & spacing
button radius 6px, card radius 8px, borders 1px solid #e0e0e0, shadows 0 2px 4px rgba(0,0,0,0.1), section spacing 80px, content width 1200px
- Sections (top to bottom)
- Hero — full-width layout, single column, large headline centered, two CTA buttons below, background gradient from #f5f5f5 to #e0e0e0
- Features — three-column grid, each with icon, heading, and short paragraph, white cards on light gray background
- Documentation — two-column layout, left sidebar with navigation list, right main content area with nested headings and code blocks
- Testimonials — horizontal scrollable row of quote cards with avatar images, alternating alignment
- Footer — single column, logo row, links grouped in columns, copyright line
- Signature details
- Hexagonal lettering in header logo
- Consistent use of rounded corners across all UI elements
- Subtle drop shadows on cards and buttons
- Monospaced code blocks with syntax highlighting
- Hover effects on interactive elements (buttons, nav items)
- Clean, minimal typography hierarchy with consistent spacing
- Other pages
- /docs: structured documentation with sidebar navigation and collapsible sections
- /blog: article list with featured image, title, excerpt, and read-more link
- /about: team section with profile cards and mission statement
範本資訊
- 分類
- Website
- 技術
- Hugo
- 價格
- 免費
原始設計來自 Hugo Themes，刊登於 Hugo Themes。Ottermind 不會複製範本程式碼，而是依據需求打造全新的網站。
Ottermind 起步用的需求
它會以草稿形式在 Studio 中開啟，送出前先補充你的品牌、受眾與頁面。
Build a website website inspired by the "Docsy" template. Reference brief: Theme Use original copy and imagery for my brand rather than the reference's placeholder content.
如何使用這個範本
- 1
點擊「使用這個範本」，在 Ottermind Studio 中開啟並自動填入需求。
- 2
在需求中補充你的品牌、受眾、頁面與內容。
- 3
Ottermind 以這套設計為靈感打造全新網站，你可以在對話中繼續修改。
