Hulio – Creative Digital Agency Astro Template

Hulio is a premium Astro agency template for creative studios, design agencies and digital marketing teams that want a bold, award-style website without building it from scratch. It comes with 11 ready-made pages, a built-in visual CMS, smooth Framer-quality animations and near-perfect Lighthouse scores, and it goes live on Cloudflare’s free plan with a single command.

Every headline, project, team member, price, image and blog post can be edited from a friendly admin panel. You can even update content by chatting with an AI assistant like Claude or ChatGPT. No coding needed for day-to-day changes.

Why Choose the Hulio Astro Agency Template?

Most agency templates look good in a demo but feel slow, hard to edit or hard to host. Hulio fixes all three. It is built with Astro 7, TypeScript and Tailwind CSS v4, so pages load fast and stay clean. The EmDash CMS gives you and your clients a simple admin panel, and Cloudflare Workers hosting keeps a typical agency site free to run.

Hulio started as one of our most popular Framer templates. This Astro version is a pixel-and-motion faithful port, rebuilt as a real code project you fully own. Prefer Framer? Get the free Hulio Framer template instead.

Pages Included

• Home: hero, keyword band, features, who we are, video block, client logos, projects, services, team, testimonials, latest posts and a closing ticker
• About: company story, award badges, animated stats, team and a closing section with floating photos
• Projects: a portfolio grid of case studies
• Project Details: cover, tags, client, overview, three process steps, gallery and closing text
• Pricing: pricing plans with a highlighted plan option
• Team: team member cards with social links
• Blog: article listing with load more
• Blog Details: author, cover, rich text body, quote, images and related posts
• Contact: contact form and FAQ accordion
• Privacy Policy (and any other legal page you add)
• 404 error page

Key Features

Built-in CMS: Edit Everything Without Code

Hulio runs on the EmDash CMS, so every section is editable from an admin panel at /_emdash/admin. Manage projects, blog posts, team members, legal pages, menus, the footer and every home and about page section. Changes go live the moment you hit Publish, with no rebuild or redeploy.

Edit Your Website With AI

Your site includes its own AI connection (an MCP server). Connect Claude, ChatGPT, Cursor or Codex and simply ask, “add a project for our new client” or “make the Gold plan $249”. The template also ships with 22 ready-made content prompts, 9 design prompts, an AGENTS.md project guide and a design.md design system file, so AI coding tools can change the design safely.

Framer-Quality Animations

Words un-blur into place, cards rise in on scroll, logos and keywords loop, counters count up, labels roll on hover and a lime arrow cursor follows the pointer over cards. Smooth scrolling is powered by Lenis, and all motion respects the visitor’s “reduce motion” setting.

Fast, Accessible and SEO Ready

• Lighthouse 100 for SEO and Best Practices on every page
• Lighthouse 100 for Accessibility on every page (95 on the home page on phones)
• Performance 99 on desktop and 90 to 98 on mobile
• Automatic sitemap, robots.txt, canonical links and social share images
• Edge page caching on Cloudflare, cleared automatically when you publish

Launch in One Command, Host for Free

Run npm run launch and Hulio builds your site, creates the database and media storage, and puts it online at your own workers.dev address. A typical agency site fits Cloudflare’s free plan, and you can connect your own domain at any time.

More Features

• Fully responsive design for phones, tablets and desktops
• Upload separate logos for the header and footer
• Working contact form: paste a Formspree or Basin endpoint to receive messages
• Video block that accepts any YouTube or Vimeo link
• Automatic social icons for LinkedIn, X, Behance, YouTube and Facebook
• Image focal points so photos crop exactly where you want
• Simple ordering for projects, posts and team members
• Change brand colors from one tokens file
• Clean Satoshi typography (free for commercial use)
• Demo content included: 6 projects, 9 blog posts and 6 team members
• Step-by-step documentation for beginners and developers

Who Is This Template For?

Hulio is a great fit for creative agencies, design studios, branding agencies, digital marketing agencies, web design and development studios, UI/UX consultancies, freelancers growing into a team, and developers building agency sites for clients.

Tech Stack

• Astro 7 (server output)
• TypeScript (strict)
• Tailwind CSS v4
• EmDash CMS with a built-in MCP server
• Cloudflare Workers, D1 database and R2 media storage
• Lenis smooth scroll
• Requires Node.js 22.16 or newer and a free Cloudflare account

Frequently Asked Questions

Do I need to know how to code?

No. Setup takes two commands, and all content is edited in the admin panel or through an AI assistant. Developers get a clean, well-documented Astro codebase to extend.

How much does hosting cost?

A typical agency site runs on Cloudflare’s free plan. Cloudflare asks for a payment method on file to enable R2 storage, which is free up to 10 GB.

Can I use Hulio for a client project?

Yes. One license covers one website, for yourself or for a client, including commercial use. You can hand the finished site over to your client. Each additional website needs another license.

What is the difference between the Astro and Framer versions?

The Framer version is free and lives inside Framer. The Astro version is a full code project you own and host yourself, with a built-in CMS, AI editing, one-command deploys and free Cloudflare hosting.

Changelog

Version 1.0.0: Initial release of Hulio for Astro.