Webサイトテンプレート

LoveIt

A Clean, Elegant but Advanced Hugo Theme for Hugo.

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

Blog · 無料

ライブデモを開くソースリポジトリを見る

ページ

ライブデモのページごとのスクリーンショットです。枠内をスクロールするとページ全体を見られます。

LoveIt Webサイトテンプレート、/ ページ、2 番目 — /LoveIt

LoveIt Webサイトテンプレート、/about/ ページ、1 番目 — /about/About LoveIt - LoveIt

LoveIt Webサイトテンプレート、/about/ ページ、2 番目 — /about/About LoveIt - LoveIt

LoveIt Webサイトテンプレート、/posts/ ページ、1 番目 — /posts/All Posts - LoveIt

デザイン解説

このテンプレートのデザインを AI が読み解いたものです：配色、書体、余白、セクション、特徴的なディテール。テンプレートを使うと Ottermind はここから始めます。

この解説はまだ日本語に対応していないため、英語で表示しています。

Overall: blog, clean and modern, low density, light
Palette: background #ffffff; surfaces [#f8f8f8]; text #161209; muted text #a9a9b3; primary #2d96bd; accents []
Type: headings system-ui, 700, sentence-case; body system-ui, 16px; scale h1 20px
Shape & spacing: card radius 0px, borders none, shadows none, section spacing 40px, content width 788px
Sections (top to bottom): header — horizontal navigation with logo on left, menu items right-aligned, social icons below avatar, white background
hero — centered avatar with tagline, social media icons in a row beneath, white background
posts grid — two-column layout on desktop, each post has featured image, headline, author/date, category, excerpt, tags, read more link, light gray surface background
footer — centered attribution line with Hugo and theme credit, copyright notice, CC license
Signature details: consistent use of system-ui font across all elements
minimalistic design with no decorative borders or shadows
uniform spacing between sections and cards
feature list with icon prefixes in the about page
monochrome social icons in circular form
responsive layout with mobile-first structure
Other pages: /about/: full-width hero with device mockups, features listed in collapsible sections with icons, light blue info box at top
/posts/: chronological list grouped by year, plain text layout with dates aligned right, minimal styling

テンプレート情報

カテゴリ: Blog
技術: Hugo
ライセンス: MIT
作者: Dillon
掲載元: Hugo Themes
価格: 無料

blog
dark

オリジナルデザイン：Dillon（Hugo Themes に掲載）。Ottermind はテンプレートのコードをコピーせず、ブリーフをもとに新しいサイトを作ります。

Ottermind が起点にするブリーフ

Studio で下書きとして開きます。送信前にブランド、対象者、ページを書き足してください。

Build a blog website inspired by the "LoveIt" template. Reference brief: A Clean, Elegant but Advanced Hugo Theme for Hugo. Style and features to reflect: blog, dark. Use original copy and imagery for my brand rather than the reference's placeholder content.