How it works

Building with a Moirai template

Browse templates
Holt template preview
The Guildwell homepage at desktop and mobile
The Tacit homepage at desktop and mobile

What happens after you buy

  1. 01

    Buy and unzip

    The download is one zip. Inside it: the Figma file, a README, and the licence as a separate markdown file. Open the Figma file and you land on the Start Here page.

  2. 02

    Read the Start Here page

    The README covers fonts, where the tokens live, and how the pages are organised. The licence artboard covers what you can and cannot do with the file. Ten minutes, once.

  3. 03

    Take the system into your build tool

    The design system page holds the tokens, the type scale, and every component. Whichever route you take below, that page is what you point at first. Set up the tokens before you build a single section and the rest of the work stops fighting you.

  4. 04

    Build the pages

    Every page artboard has desktop and mobile drawn, so you are never guessing how a section should behave on a phone.

Webflow, agents, Ship Studio, or your own code

Where you build it

Nothing in the file assumes a framework, so the same design goes anywhere.

Webflow

Create the classes from the design system page first. Layer names are already Client First, so a layer called template-card_image is the class you make. Once the site is up you can connect Claude through the Webflow MCP and have it make edits in the Designer.

An AI agent

Turn on Dev Mode and connect the file over MCP. Point the agent at the design system page before you ask for any page. That single step is the difference between a build that matches the design and a build that reinvents it.

Ship Studio

Start a project in whatever framework suits the client, paste the tokens into your CSS, and work through the pages in order. The README lists the font imports you need.

Your own code

Read the tokens off the design system page and go. Nothing in the file assumes a framework.

What you need on your side

Short list, and none of it costs anything beyond the file.

The Tacit homepage at desktop and mobile

A Figma account

Dev Mode and MCP access need a paid plan. Opening the file, reading the tokens and rebuilding by hand all work on the free one.

The fonts

Google Fonts throughout, listed with weights and import code in the README. Nothing to buy.

Somewhere to host

The file has no opinion about which.

Start your next client project from a design

Browse templates