Hugo Documentation

aafu Theme
aafu is a modern, responsive portfolio and blog theme built with Hugo and powered by Tailwind CSS 4.x.
π Live Demo
Experience the theme in action: aafu.pages.dev
π Installation
π§ͺ Local Development
Option 1: Standalone Project
The repository functions as a complete Hugo site out of the box. To run it locally:
# Clone the repository
git clone https://github.com/darshanbaral/aafu.git
cd aafu
# Install dependencies
npm install
# Start the development server
hugo server
Option 2: Use as a Hugo Theme
To use aafu
as a theme within your own Hugo project:
Add the theme:
git submodule add https://github.com/darshanbaral/aafu.git themes/aafu
Copy the following files/folders from
aafu/
to your project root:- Files:
config.yaml
package.json
tailwind.config.js
- Folders:
assets/
static/
The project structure should look something like:
your-hugo-project/ βββ config.yaml βββ package.json βββ tailwind.config.js βββ assets/ βββ content/ βββ static/ βββ themes/ β βββ aafu/
- Files:
Enable the theme by setting the theme in
config.yaml
:theme: aafu
Install dependencies and start development server:
npm install hugo server
π§ Getting Started
Configuration (config.yaml
)
Customize the theme by modifying the config.yaml
.
Key customization options:
- Define which sections appear in the accordion.
- Control the order of sections.
- Choose which section should be expanded by default.
Profile Image
Replace profile.jpg
in static/images
with your own profile picture.
Theme Modes
To configure the theme mode, modify the params.theme.mainTheme
attribute in config.yaml
.
- Light Mode (
light
) - Dark Mode (
dark
) - Auto Mode (
null
- adjusts based on userβs device settings)
π¦ Deployment
This theme supports search functionality using Pagefind. Before deploying, index your content using the following command:
hugo && npx -y pagefind --site public
π Reporting Issues & Feature Requests
If you encounter any bugs or have feature suggestions, please open an issue.
Enjoy using aafu! π