Webサイトテンプレート

Docsy

Theme

このテンプレートの説明はまだ日本語に対応していないため、英語で表示しています。

Website · 無料

ソースリポジトリを見る

デザイン解説

このテンプレートのデザインを 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（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.