Agent skill

Hugo Theme

by magnus919 in magnus919/agent-skills

Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules…

MITAuto-check passedFrontend & Design

Install Hugo Theme

skills CLI
$ npx skills add magnus919/agent-skills --skill hugo-theme -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install magnus919/agent-skills hugo-theme --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/magnus919/agent-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/hugo-theme .claude/skills/hugo-theme && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
hugo-theme
GitHub stars
115
Token cost
~1.7k tokens
SKILL.md length
534 words
Files
11 (incl. references)
Skills in repo
131
Repo updated
First seen
Licence
MIT

At a glance

Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules…

  • Working on a Hugo theme
  • SKILL.md covers Reference Files, Quick Start and Common Pitfalls
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • Site template layer

What it does

Hugo Theme is an agent skill from magnus919/agent-skills. Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules, performance, SEO, and CI/CD. Use when working on a Hugo theme or site template layer. Do not use this skill for unrelated requests; route to the nearest named specialist.

Its SKILL.md is about 1.7k tokens, which your agent loads only when the skill is triggered. The skill folder holds 12 other files, including reference files (for example `README.md`, `evals/evals.json` and `references/asset-pipeline.md`). Compatibility notes: Works with any agent framework supporting the Agent Skills format.

It sits in Frontend & Design, covering Static sites and blogs, Social media graphics and Game assets and audio. The repository describes itself as: Curated collection of AI agent skills for Hermes and other agent frameworks. The licence is MIT.

When your agent uses it

  • Working on a Hugo theme
  • Site template layer
  • Unrelated requests
  • Route to the nearest named specialist

Example prompts

  • “/hugo-theme”

Requirements

  • Compatibility (from SKILL.md): Works with any agent framework supporting the Agent Skills format.

What it can do on your machine

Read from SKILL.md and the folder at commit 22b4723. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are go-html-template and bash).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

  • Compatibility

    Works with any agent framework supporting the Agent Skills format.

    From compatibility in the SKILL.md frontmatter.

Context cost

Hugo Theme loads about 1.7k tokens when it runs, and up to ~25k if it reads all its reference files. Until then it costs about 93 tokens; SKILL.md has 534 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~93
When it runs · the whole SKILL.md, loaded when a task matches
~1.7k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~25k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from magnus919/agent-skills at commit 22b4723, republished under its MIT licence (© magnus919). 534 words, ~1,654 tokens.

Download SKILL.mdSave it as .claude/skills/hugo-theme/SKILL.md (or your agent's skills folder). This skill also uses 10 other files; get the full folder from GitHub.
name
hugo-theme
description
Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules, performance, SEO, and CI/CD. Use when working on a Hugo theme or site template layer. Do not use this skill for unrelated requests; route to the nearest named specialist.
compatibility
Works with any agent framework supporting the Agent Skills format.
license
MIT
metadata.source
Research compiled from official Hugo docs, major theme repositories, Hugo power user blogs, and community discussions.
metadata.hugo-version
v0.154+

Hugo Theme Development

Intermediate-to-advanced patterns for Hugo CMS theme development. Load the relevant reference file for your task.

Reference Files

TopicHugo MinLoad when...File
Template Architecturev0.120+You need to set up base templates with blocks, understand template lookup order (kind/layout/type/section), create partials, use partial decorators (v0.154+), or work with shortcode fundamentalsreferences/template-architecture.md
Asset Pipelinev0.161+You're integrating Tailwind CSS v4 (css.TailwindCSS) or v3 (PostCSS), using Hugo Pipes for SCSS/JS bundling, setting up fingerprinting and SRI, building responsive images with srcset, or processing page/global/remote resourcesreferences/asset-pipeline.md
Shortcodes & Render Hooksv0.112+You need complex nested shortcodes, raw HTML shortcodes, markdown rendering inside shortcodes, custom render hooks for links/images/headings/code blocks, or language-specific code block rendering (Mermaid, etc.)references/shortcodes-and-hooks.md
Content Organization & i18nv0.126+You're working with leaf vs branch bundles, headless bundles, cover images, custom taxonomies, content adapters (v0.126+, dynamic pages), section-specific layouts, archetypes, or internationalization (translation tables, multilingual)references/content-and-i18n.md
Cover Imagesv0.120+You need to add cover/hero images to articles, support both page bundle resources and frontmatter paths, generate responsive srcsets, or handle the no-cover case gracefullyreferences/cover-images.md
Modules & Performancev0.109+You're using Hugo Modules (init, import, vendor, workspace), building theme components with mount configuration, optimizing build speed with partialCached, configuring cache TTLs, or using configuration-driven theming (params, cascade)references/modules-and-performance.md
Design, UX & Accessibilityv0.120+You need typography systems, accessible color palettes, design tokens, semantic HTML landmarks, ARIA patterns, keyboard navigation, accessible forms, content-first layouts, responsive navigation, engagement patterns (reading progress, dark mode toggle, sharing), Core Web Vitals optimization, container queries, :has() selectors, or testing/QA automation (axe-core, Lighthouse CI, visual regression)references/design-accessibility.md
SEO, Output Formats & CI/CDv0.120+You need JSON-LD structured data, Open Graph / Twitter Cards, custom output formats (JSON, AMP), sitemap customization, or CI/CD pipelines for themes (GitHub Actions, testing, deployment)references/seo-outputs-testing.md

Quick Start

go-html-template
{{/* Minimal theme baseof.html — start here */}}
<!DOCTYPE html>
<html lang="{{ .Site.Language.Lang }}">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
  {{ block "styles" . }}{{ end }}
</head>
<body>
  {{ block "header" . }}{{ partial "header.html" . }}{{ end }}
  <main>{{ block "main" . }}{{ end }}</main>
  {{ block "footer" . }}{{ partial "footer.html" . }}{{ end }}
  {{ block "scripts" . }}{{ end }}
</body>
</html>
Step-by-Step: Bootstrap a New Theme
bash
# 1. Create the theme directory
mkdir -p themes/my-theme/{layouts/{_default,_markup,partials,shortcodes},assets/{scss,css,js}}

# 2. Create baseof.html (use the template above) defining blocks:
#    title, styles, header, main, footer, scripts

# 3. Create partials for reusable components
#    layouts/partials/header.html, footer.html, css.html

# 4. Set up your asset pipeline
#    - SCSS  → assets/scss/main.scss + toCSS partial
#    - Tailwind  → assets/css/main.css + css.TailwindCSS partial
#    - JS  → assets/js/main.js + js.Build

# 5. Configure hugo.yaml
#    theme: my-theme
#    See the reference file for your chosen CSS approach.

# 6. Build and verify
hugo --gc
ls public/ | head

Tip: Project-level layouts/ overrides theme layouts/. If you want to test your theme in isolation, keep the project layouts/ directory empty until you need overrides.

Show full SKILL.md (210 more words)Show less

Common Pitfalls

  • SCSS requires Hugo extended edition. The default macOS/Homebrew Hugo build is NOT extended. Verify with hugo version | grep extended.
  • Tailwind v4 uses css.TailwindCSS, not PostCSS. Don't install postcss-cli for v4 — use the native pipe directly. Tailwind v3 still needs the PostCSS pipeline.
  • partialCached stale with non-constant args. Variant strings (.Section, page.RelPermalink) must be unique per caller. Repeated section names produce stale results.
  • hugo new respects archetype directory structure. Place archetypes at archetypes/<section>/index.md to create page bundles instead of flat files.
  • resources.Get looks in assets/, not static/. Files in static/ are copied verbatim and not processed by Hugo Pipes. Use assets/ for any file that goes through Pipes.
  • Content adapter templates MUST use _content.gotmpl naming. Regular .md files in the same directory are ignored when a _content.gotmpl exists.
  • Render hook templates go in _markup/ subdirectories. Not in _default/ directly — they need layouts/_default/_markup/render-link.html or section-specific layouts/<type>/_markup/.
  • block in partials conflicts with define in page templates. {{ block "title" . }} inside a partial (e.g. head.html) uses the same Go template namespace as {{ define "title" }} in page templates (e.g. single.html). When both exist in the render tree, Hugo errors with multiple definition of template "title". Fix: use direct page variables (.Title, .Site.Title) in partials instead of block. Reserve block exclusively for the baseof.html shell.

© magnus919, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 10 other files (references) in hugo-theme of magnus919/agent-skills.

  • SKILL.md
  • README.md
  • evals/evals.json
  • references/asset-pipeline.md
  • references/content-and-i18n.md
  • references/cover-images.md
  • references/design-accessibility.md
  • references/modules-and-performance.md
  • references/seo-outputs-testing.md
  • references/shortcodes-and-hooks.md
  • references/template-architecture.md

Open the folder on GitHubat commit 22b4723

Compare with similar skills

Hugo Theme next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Hugo Theme compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Hugo Theme this skillmagnus919/agent-skills115—~1.7kAutomated safety check: PassMIT
Web Visualsglifxyz/glif-mcp-server213—~1.5kAutomated safety check: PassMIT
Docs Social Imagesrhesis-ai/rhesis397—~377Automated safety check: PassCustom licence
Create Docsvictorgarciaesgi/nuxt-typed-router4132 repos~2.8kAutomated safety check: PassMIT
Paperclip Pagepaperclipai/paperclip99k—~1kAutomated safety check: PassMIT
Kill AI Slopyetone/kill-ai-slop1.3k—~1.4kAutomated safety check: PassApache-2.0

Similar skills

  • Web Visuals

    glifxyz/glif-mcp-server

    Make images, textures, illustrations and background video for a website or app you are building, with Glif, and wire them into the code.

    213 GitHub stars~1.5k tokensUpdated yesterday
    Media & CreativeAuto-check passed
  • Docs Social Images

    rhesis-ai/rhesis

    How the docs site generates per-page og:image cards, and the cache and font traps when changing them.

    397 GitHub stars~377 tokensUpdated 2 days ago
    Media & CreativeAuto-check passed
  • Create Docs

    victorgarciaesgi/nuxt-typed-router

    Create complete documentation sites for projects. An agent skill from victorgarciaesgi/nuxt-typed-router.

    413 GitHub starsUsed in 2 repos~2.8k tokens
    Frontend & DesignAuto-check passed
  • Paperclip Page

    paperclipai/paperclip

    Publish static HTML pages and asset folders to the Paperclip S3/CloudFront page host.

    99k GitHub stars~1k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Kill AI Slop

    yetone/kill-ai-slop

    Find and remove AI slop — the generic, machine-default visual and copy tics of vibe-coded products — from a web project.

    1.3k GitHub stars~1.4k tokensUpdated 25 days ago
    Frontend & DesignAuto-check passed
  • Static Sites

    bionic-gpt/bionic-gpt

    Create or modify Bionic's generated marketing site, documentation, blog, course pages, and static assets.

    2.4k GitHub stars~920 tokensUpdated 3 days ago
    Frontend & DesignAuto-check passed

More from magnus919/agent-skills

All 131 skills in this repo
  • Artifact Pyramids

    magnus919/agent-skills

    Organize durable agent research outputs as summaries, analysis, and evidence dossiers.

    115 GitHub stars~2.7k tokensUpdated today
    Auto-check passed
  • Ascii City Engine

    magnus919/agent-skills

    Build portable, first-person colored ASCII city engines and small GIS-derived city packs.

    115 GitHub stars~1.1k tokensUpdated today
    Auto-check passed
  • Color Management

    magnus919/agent-skills

    Manage color workflows with ICC profiles, working spaces, gamut mapping, and color science.

    115 GitHub stars~2.6k tokensUpdated today
    Auto-check: notes
  • Data Scientist

    magnus919/agent-skills

    A skill your agent uses for PhD-level expertise in data science, statistics, and machine learning: rigorous statistical analysis, experimental design, causal inference, advanced modeling, research…

    115 GitHub stars~4.1k tokensUpdated today
    Auto-check passed
  • Docker Compose

    magnus919/agent-skills

    Use Docker Compose to define, run, debug, and harden multi-container applications.

    115 GitHub stars~2k tokensUpdated today
    Auto-check: notes
  • Fpga Development

    magnus919/agent-skills

    Design, review, simulate, and verify FPGA logic using explicit RTL contracts, clock and reset models, CDC analysis, timing constraints, and reproducible implementation evidence.

    115 GitHub stars~2.7k tokensUpdated today
    Auto-check passed

Questions about Hugo Theme

What does Hugo Theme do?

Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules…. Hugo Theme is an agent skill from magnus919/agent-skills. Build, customize, and debug advanced Hugo CMS themes — template architecture, asset pipeline (CSS/JS/image processing), shortcodes and render hooks, page bundles, cover images, Hugo Modules, performance, SEO, and CI/CD.

When should I use Hugo Theme?

Hugo Theme fits situations like: working on a Hugo theme; site template layer; unrelated requests; route to the nearest named specialist.

How do I install Hugo Theme in Claude Code?

Run `npx skills add magnus919/agent-skills --skill hugo-theme -a claude-code`. Or copy the skill folder (hugo-theme in magnus919/agent-skills) into .claude/skills/hugo-theme in your project. Claude Code loads it when a task matches its description.

How do I install Hugo Theme in Codex?

Run `npx skills add magnus919/agent-skills --skill hugo-theme -a codex`. Or copy the skill folder (hugo-theme in magnus919/agent-skills) into .agents/skills/hugo-theme in your project. Codex loads it when a task matches its description.

Can I use Hugo Theme in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add magnus919/agent-skills --skill hugo-theme -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/hugo-theme, .gemini/skills/hugo-theme, .github/skills/hugo-theme and .opencode/skills/hugo-theme in your project.

What does Hugo Theme need to run?

SKILL.md names no scripts, command-line tools or credentials: Hugo Theme is instructions for the agent only. Compatibility (from SKILL.md): Works with any agent framework supporting the Agent Skills format..

Does Hugo Theme access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Hugo Theme safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Hugo Theme use?

Hugo Theme is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Hugo Theme use?

About 1.7k tokens (SKILL.md is roughly 6.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 24k tokens, read only when the agent opens those files.

What are the alternatives to Hugo Theme?

Skills that share tags, products or a category with Hugo Theme: Web Visuals (glifxyz/glif-mcp-server, 213 stars), Docs Social Images (rhesis-ai/rhesis, 397 stars), Create Docs (victorgarciaesgi/nuxt-typed-router, 413 stars) and Paperclip Page (paperclipai/paperclip, 99k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Hugo Theme?

magnus919 (a GitHub user) maintains it in magnus919/agent-skills, which has 115 GitHub stars. The repository holds 131 skills in this directory. The repository was last updated on October 10, 2026.

Source: magnus919/agent-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.