All BaseLayer themes share one layout. Once you know your way around one, you know them all.
Folders
src/
assets/images/ Photos, optimized at build time
blocks/ Full-width page sections (navbar, footer, hero, ...)
components/ Smaller building blocks used inside sections
config/ Site settings, split by job
content/blog/ Blog posts in Markdown
layouts/ Page shells: BaseLayout, ProseLayout
lib/ Helpers for SEO, schema, images, and navigation
pages/ One file per route
styles/ Design tokens and base styles
public/ Files served as-is: favicon, logos, og.png
scripts/ Build helpers: social images, SEO check, IndexNow
Pages every theme includes
| Page | File |
|---|---|
| Home | src/pages/index.astro |
| About | src/pages/about.astro |
| Contact | src/pages/contact.astro |
| Blog index and posts | src/pages/blog/ |
| Privacy, terms, accessibility | src/pages/privacy.md, terms.md, accessibility.md |
| 404 | src/pages/404.astro |
Plus the generated files: /rss.xml, /sitemap-index.xml, /robots.txt, /llms.txt, and /schemamap.xml.
Themes add their own pages on top, such as a services page or a menu. Your theme’s page under Themes lists them.
Blocks and components
Blocks live in src/blocks/ and are full-width sections: a navbar, a hero, a pricing table, a footer. Pages are mostly a stack of blocks.
Components live in src/components/ and are the smaller parts blocks are made of:
| Folder | Examples |
|---|---|
elements/ |
Button, Text, Icon, OptimizedImage |
containers/ |
Wrapper, PageHeader, CtaBand |
forms/ |
ContactForm |
nav/, footer/ |
Navbar menus and footer bars |
global/ |
Seo, JsonLd, Reveal |
A theme only ships the blocks it uses, so there’s nothing to delete before launch.
Config first, props second
Blocks read their default copy from src/config/. Every default can be overridden with a prop on the page:
---
import Hero01 from "@/blocks/hero/Hero01.astro";
---
<!-- Uses the copy in src/config/blocks.ts -->
<Hero01 />
<!-- Same block, different heading on this page only -->
<Hero01 heading="Spring menu is here" />
Change the config to update a block everywhere it appears. Pass a prop for a one-off.
What it’s built with
| Tool | Used for |
|---|---|
| Astro 7 | Pages, layouts, content collections, image optimization |
| Tailwind CSS v4 | Styling, with the Forms and Typography plugins |
| Lucide | Icons |
| TypeScript | Config and helpers |
Interactivity such as menus and accordions is plain JavaScript. There’s no React, Vue, or other framework to learn or ship.