Website template

LoveIt

A Clean, Elegant but Advanced Hugo Theme for Hugo.

Blog · Free

LoveIt

Pages

Screenshots of the live demo, page by page. Scroll inside a page to see all of it.

/LoveIt
LoveIt website template, / page, part 1LoveIt website template, / page, part 2
/about/About LoveIt - LoveIt
LoveIt website template, /about/ page, part 1LoveIt website template, /about/ page, part 2
/posts/All Posts - LoveIt
LoveIt website template, /posts/ page, part 1

Design breakdown

An AI reading of this template's design: colors, type, spacing, sections and signature details. Ottermind starts from it when you use the template.

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

Template details

Category
Blog
Built with
Hugo
License
MIT
Author
Dillon
Listed on
Hugo Themes
Price
Free
  • blog
  • dark

Original design by Dillon, listed on Hugo Themes. Ottermind does not copy the template's code; it builds a new site from the brief.

The brief Ottermind starts from

It opens in Studio as a draft — add your brand, audience and pages before you send.

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.

How to use this template

  1. 1

    Click “Use this template” to open it in Ottermind Studio with its brief filled in.

  2. 2

    Add your brand, audience, pages and content to the brief.

  3. 3

    Ottermind builds a new site inspired by this design — keep editing it in the chat.