Astro Idol is a free, open-source landing page template for micro SaaS products, built as a single Astro project with Skeleton CSS and split into reusable components for hero, pricing, customer, and footer sections. A live demo runs at idol.indiebold.com. It is distributed via GitHub by LAB-CH3 and includes the standard Astro file structure, so a working landing page is available after running npm install and npm run dev.
What is Astro Idol?
Astro Idol is a landing page template for micro SaaS products, created with the Astro static-site framework and styled with Skeleton CSS. The template ships as a ready-to-run project: a single index.astro page under src/pages/, with reusable components in src/components/ including Header, Hero, Pricing, Customer, Brief, and Footer. It is maintained by the indie developer LAB-CH3 and available on GitHub, where the repository has 69 stars. Commands and project conventions follow the standard Astro workflow, so users can install dependencies with npm install, run a local dev server with npm run dev, and build a production site to ./dist/ with npm run build.
Key Features
- Astro framework — the template uses Astro, which compiles components and pages into static HTML with zero JS by default, so the landing page loads quickly.
- Skeleton CSS styling — styling is handled by Skeleton CSS, a lightweight, class-based CSS framework that keeps the page minimal and mobile-friendly without a heavy design system.
- Prebuilt sections — includes Hero, Pricing, Customer, Brief, Header, and Footer components, each as an
.astrofile that can be edited independently. - Single-page layout — all sections are composed into one landing page (
index.astro), so the template is ready for a SaaS product's marketing page out of the box. - Standard Astro commands — development uses
npm run dev(serves onlocalhost:3000), production builds withnpm run build, and previews withnpm run preview. - Pro upgrade path — a paid "Astro Idol Pro" version is offered via idolpro.indiebold.com, though the free template already contains the core landing-page components.
- Open-source distribution — the code is based on the standard Astro starter structure and published on GitHub by LAB-CH3 for anyone to fork or download.
Who should use Astro Idol?
- Indie SaaS developers — use the template to quickly launch a polished landing page for a micro SaaS product, avoiding having to build the hero, pricing, and customer sections from scratch.
- Astro learners — use the template as a reference for structuring a single-page Astro project with components and a layout, since it follows the standard Astro file conventions.
- Design-conscious founders — use the minimal Skeleton CSS styling as a starting point for a clean, mobile-responsive landing page that can be customized with additional CSS.
What can you do with Astro Idol?
- Micro SaaS founders: set up a landing page that includes a hero, pricing table, customer logos, and a brief explanation of the product — all sections are already wired into one index page.
- Developers shipping quickly: clone or download the template, run
npm installandnpm run dev, then edit the component files to replace placeholder content with product copy, pricing tiers, and customer names. - Astro site maintainers: use the template's component-based structure as a pattern for breaking a landing page into Header, Hero, Pricing, and Footer components that can be reused across other pages.
How does Astro Idol work?
The template follows the standard Astro workflow: install dependencies with npm install, start a local dev server at localhost:3000 with npm run dev, edit the .astro files in src/components/ and src/pages/index.astro, then build the production site to ./dist/ using npm run build.
Pros and cons
- Pros: lightweight and fast because Astro generates static HTML by default; includes all common landing-page sections; open-source with a public GitHub repository; straightforward setup using npm.
- Cons: the free version includes only a single landing page — no blog, docs, or dashboard pages; styling relies on Skeleton CSS's default classes, so deeper theming requires writing custom CSS.
Pricing
Astro Idol is free and open-source. A paid Pro upgrade is available through the idolpro.indiebold.com page, but the source documentation does not list specific pricing tiers or amounts.
FAQ
Is Astro Idol free?
Yes, the base Astro Idol template is free and open-source on GitHub. The author also offers an optional paid Pro version via idolpro.indiebold.com, but the free template already includes the core Hero, Pricing, Customer, Brief, Header, and Footer sections.
What frameworks does Astro Idol use?
Astro Idol is built on the Astro static-site generator, so pages are compiled to HTML with minimal JavaScript. Styling is provided by Skeleton CSS, a minimal CSS class framework; all components are written as .astro files.
How do I run Astro Idol locally?
Clone or download the repository, run npm install to install dependencies, then run npm run dev to start the development server at localhost:3000. Use npm run build to generate a production build in ./dist/.
Can I customize the landing page?
Yes, the template is open-source. Edit the component files in src/components/ to change the hero, pricing, customer, brief, footer, and header content. The page shell and metadata live in src/layouts/Layout.astro, and src/pages/index.astro assembles the sections.
Does Astro Idol include a blog or documentation pages?
No, the free version ships with only the single index.astro landing page and its components. There are no built-in blog, documentation, or dashboard pages, so additional Astro pages would have to be created separately.
