網站範本

Doks

Build beautiful, high-performance documentation websites with Doks.

這個範本的介紹目前還沒有繁體中文版本，先以英文顯示。

Landing Page · Blog · 免費

開啟線上示範查看原始碼儲存庫

頁面

線上示範的逐頁截圖，在頁面框內捲動即可查看完整頁面。

Doks 網站範本，/blog/ 頁面，第 1 部分 — /blog/Blog | My Docs

Doks 網站範本，/docs/guides/example-guide/ 頁面，第 1 部分 — /docs/guides/example-guide/Example Guide | My Docs

設計解讀

AI 對這套範本設計的解讀：配色、字體、間距、區塊與標誌性細節。使用範本時，Ottermind 會以它為起點。

這份解讀目前還沒有繁體中文版本，先以英文顯示。

Overall: documentation site, clean and minimal, low density, light
Palette: background #ffffff; surfaces [#3347ff, #edeef3]; text #000000; muted text #1d2d35; primary #3347ff; accents []
Type: headings Jost, 700, sentence-case; body Jost, 14px; scale h1 52px, h2 20px, h3 18px
Shape & spacing: button radius 800px, card radius 0px, borders 1px solid #eaeaea, shadows none, section spacing 64px, content width 1320px
Sections (top to bottom): Header — horizontal navigation with logo, links, and icons on right; white background
Hero — centered headline, subtext, and primary CTA button; dotted pattern below
Content grid — three-column layout with instructions; each column has a heading and paragraph
Footer — thin line above, two lines of text aligned left and right; white background
Signature details: Rounded pill-shaped primary button in blue
Dotted horizontal divider beneath hero
Light gray border around blog post card
Collapsible sidebar menu on docs page
"On this page" table of contents on right
Minimalist footer with attribution and privacy link
Other pages: /blog/: single blog post card with date and read time, centered under "Blog" heading
/docs/guides/example-guide/: sidebar navigation, main content with guide text, next link at bottom, TOC on right

範本資訊

分類: Landing Page, Blog, Documentation, Starter Kit
技術: Hugo
授權: MIT
作者: Henk Verlinde
來源: Hugo Themes
價格: 免費

blog
bootstrap
dark-mode
docs
landing
minimal

原始設計來自 Henk Verlinde，刊登於 Hugo Themes。Ottermind 不會複製範本程式碼，而是依據需求打造全新的網站。

Ottermind 起步用的需求

它會以草稿形式在 Studio 中開啟，送出前先補充你的品牌、受眾與頁面。

Build a landing page website inspired by the "Doks" template. Reference brief: Build beautiful, high-performance documentation websites with Doks. Style and features to reflect: blog, bootstrap, dark-mode, docs, landing, minimal. Use original copy and imagery for my brand rather than the reference's placeholder content.