Skip to content

Why?

What is Astro Theme Provider?

Astro Theme provider is a tool for authoring theme integrations. These themes are authored inside a package similar to a normal Astro project. Themes can then be published as an integration for others to use.

Why use Astro Theme Provider?

Problems with current themes

In Astro, typically a theme is authored as a complete project and published as a template that users can clone and customize. Theme templates are a very common pattern, but this pattern has many downsides that theme authors may not be aware of:

  • Not beginner friendly: The largest demographic of theme users are people who are new to Astro and web development in general. Theme templates may be hard to setup and understand for new developers.
  • Cannot be updated easily: Merging improvements from a theme template can be difficult if not impossible once a user customizes their local copy of the template.
  • Cannot be used in existing projects: Theme templates are authored as complete Astro projects, they cannot be used inside existing projects.

Themes as integrations

A better way to create themes is to shift away from project templates and towards Astro integrations. Integrations have many different advantages over a traditional template; the largest one being that integrations can be consumed as an NPM package. This allows users to:

  • Install themes with a single command (e.g., astro add my-theme)
  • Update themes with a single command (e.g., pnpm upgrade my-theme)
  • Use a theme inside an existing project
  • Use multiple themes inside a single project
  • Manage and configure themes from the Astro config

Improving theme creation

Although theme integrations may be more user-friendly, they are generally much harder to author, requiring a deep level of knowledge about Astro and Vite to create. Astro Theme Provider solves this by allowing theme authors to create theme integrations without having to write any integration code. Themes are authored inside a package similar to a normal Astro project, and are then exported as an integration for others to use.

Real-world Example

The best example of a theme integration, and pioneer of the pattern, is Starlight. Starlight allows you to build an entire documentation website with a configuration file and some markdown. It has become one of the most popular themes for Astro because it is easy to setup and use. Starlight’s success proves that theme integrations are a powerful pattern that has been under utilized in the Astro ecosystem and Astro Theme Provider wants to change that!