Introduction

Create, maintain, and publish a brand guidelines website with Brandtree.

Brandtree turns your brand data and written guidelines into a static website. It supplies navigation, light and dark themes, and components for showing logos, colors, typography, and other parts of your identity.

Define reusable brand facts once in brandtree.config.ts. Write your guidelines in Markdown or MDX. Components connect the two: change a configured color and every exhibit that uses it updates.

Create a project directly by running the following command:

pnpm dlx brandtree init

Quickstart includes npm and Bun alternatives and walks through your first page.

Choose your next step

Create your first site

Scaffold a project, configure your brand, and add a page.

Configure your brand

Set your identity, colors, themes, typography, and artwork.

Create content

Write pages and combine prose with Brandtree components.

Manage your site

Organize navigation, add languages, and prepare for deployment.

How a project fits together

Configure the brand

brandtree.config.ts holds shared facts such as the palette, logo artwork, typography, and contact information. It also holds site settings.

Write the guidelines

Pages in content/ explain how to use your identity. MDX lets you add components that display the configured brand data alongside that explanation.

Check and publish

The CLI prepares an Astro runtime, validates your inputs, and builds a static website into dist/ for your hosting provider.