Kiln docs
v1.1.0
Get help
● Use · /app

Using the builder
from brief to published site.

The builder lives at /app. This page is for agency staff and clients who build sites. It can be shared with your clients as it is.

16 templates21 section typesBlogReview linksExport

01Workspaces

A workspace holds the sites of one client, its members, its plan and its credit balance.

  • Agency staff create workspaces (Create a workspace, or + New workspace… in the workspace menu) and can open every workspace.
  • Clients see the workspaces they are members of. With open sign-up, a new account gets its own workspace.
  • Team page (owners): Invite someone with an e-mail and a role → Create invite. The invite link is valid for 7 days and is also e-mailed if the operator has set up e-mail. If the operator allows it, the owner can also store the workspace's Own AI key here (see AI).
  • Billing page: plan, credit balance, plans and credit packs to buy, the price of each AI action, the credit history. See Client billing.

Roles

RoleCan do
OwnerEverything, including the team, custom domains, unpublishing and deleting sites and form messages, billing.
EditorBuilds, edits and publishes sites, uses AI, exports, sends review links.
ClientEdits texts and images only (see below).
ViewerLooks at sites and reads form messages. Changes nothing.

The client role is for handing a finished site to a client. A client can change the texts of existing sections (in every language the site already has) and replace images, including uploads and stock photos. A client cannot add, remove, move or re-lay out sections, add or remove list items, change link addresses, the theme, page addresses, site settings or languages, and cannot use AI, write in the blog, restore history, send review links or publish. The editor shows Content editing in the top bar and hides most of what the role cannot use. The server checks every save: a save that changes anything except texts and images is refused with "Your role can change texts and images. Ask the agency to change sections, layout or design."

02The Sites page

Each site card shows a live thumbnail of the home page and its status. The ⋯ menu on a card has:

  • Open.
  • Duplicate: a copy named "<site> (copy)" (editors and owners; counts against the plan's site limit).
  • Save as template (agency staff only): see Agency templates.
  • Delete (owners): cannot be undone.

Getting started is a short checklist above the sites: create the first site, send it for review, publish it, invite the client. It disappears when every step is done, or when you hide it.

The Sites page with site cards and the Getting started checklist

03Creating a site

On the workspace's Sites page, choose New site (Start from a brief) or Pick a template.

From a template

Sixteen templates are included, filtered by category: Studio (agency), Corner Café and Arcade (food and drink), Clinic (health), Launch and Lumen (software), Workshop (trades), Bloom (beauty), Noir (premium), Counsel (professional), Concrete (creative), Linen and Terra (wellbeing), Sorbet (events), Onyx (luxury) and Landing page (marketing). A template creates the site at once, with its pages, sections and style. It costs no credits. Template text explains what to write; it does not pretend to be a real business.

Agency templates

Agency staff can turn any site into a template: ⋯ on the site card → Save as template → a name. Saved templates appear under the category Your agency in every workspace, and everyone who can create sites can start from them. Kiln removes the analytics ids, the form webhook, the WhatsApp and call buttons, the announcement bar, the blog and its posts, and all translations. Texts and images are kept, so remove anything that belongs to one client before you save. Staff can delete an agency template from the template gallery; sites made from it stay.

From a brief

  1. The brief. Business name; what the business does and for whom; audience; tone (friendly, professional, bold, luxury, playful or calm); pages (a preset or your own comma-separated list, home first); languages (the first is the main language; the plan sets how many); and facts the copy may use: phone, e-mail, address, opening hours, real prices, real client names. The AI uses only these facts.
  2. The plan board. Plan the site returns the pages, the sections of each page with their purpose, and a style. Rename pages, move them, remove them; move, remove and add sections. Nothing has been written yet.
  3. Build. Write N pages (X credits) writes each page with AI and shows the progress page by page. Build as draft (free) builds the same structure without AI. When it is done, the editor opens.

Without an AI key, both steps use the free draft engine and the buttons read Plan the draft and Build the draft.

Rebuild from a client's current site

If the client already has a website, paste its address at the top of the brief and choose Read the site. Kiln reads the text of that one page and fills the brief: the business name (from the page title), a description, the e-mail addresses and phone numbers it finds, the headings and paragraphs (as facts the copy may use), up to five page names from the site's menu, and the language. Check the brief before you plan the site.

  • Only text is read. Images, styles and scripts are not copied.
  • Only public addresses work, and only the page you paste (following up to three redirects). Up to 2 MB of the page is read, and Kiln waits at most 10 seconds.
  • A site that shows its text only through JavaScript cannot be read: "No readable text on that page."
  • Each person can read 10 sites per minute.

Error messages are listed in Troubleshooting.

Template gallery with category filter

04The editor

Three panes:

  • Left: Pages lists the pages; the open page shows its sections. Click a section to select it. Drag a section in the list to move it. A dot marks a section that still has placeholders. Add page, move pages, delete pages (not the home page). Add section opens the section library.
  • Centre: the canvas. The real page at desktop (1280 px), tablet (820 px) or mobile (390 px) width, scaled to fit. Switch the device at the top.
  • Right: the inspector, with the tabs Section, Page, Theme, Languages, Blog, Checks, History and Forms.

The top bar shows the save state (Saved, Unsaved changes, Saving…, Not saved), the command palette (⌘K), undo and redo, the checks score, View (once published), Review and Publish.

Changes save automatically 1.5 seconds after you stop typing. Undo keeps the last 50 steps while the editor is open.

The editor with the section library

Editing text on the canvas

  1. Click a section on the canvas to select it.
  2. Click a text inside the selected section (or double-click any text on the page). It gets a frame and a cursor.
  3. Type. Enter or a click outside saves the change; Esc cancels it. In paragraphs and rich text, Enter starts a new line or paragraph instead; Shift+Enter adds a line break.

Headings, paragraphs, button labels and the texts of cards, steps, prices, quotes and questions can be edited this way. A field that is empty is not shown on the page: fill it in the Section tab. Link addresses, images and lists are edited in the Section tab. With another language chosen in the top bar, canvas edits are saved as that language's translation.

The section toolbar

The selected section shows a small toolbar on the canvas: ↑ and ↓ (move), Duplicate, ✦ Rewrite (opens the AI rewrite box in the Section tab; shown when AI is set up) and Delete. The same actions are at the top of the Section tab.

Asking AI to change the page

When AI is set up, a bar over the canvas reads Ask AI to change this page. Write the change in plain words, for example "Add an FAQ with 4 questions customers ask" or "Warmer colours", and send it. The AI can rewrite and re-lay out sections of the open page, add sections, remove sections and change the theme colours. It cannot add another navigation or footer. Its short answer appears above the bar.

  • Each request costs the chat price in credits (the bar shows the price and your balance). A failed request is refunded.
  • The whole answer is applied as one undo step: Undo puts the page back as it was.
  • The bar works on the open page in the main language. It is hidden for the client and viewer roles.
  • The AI follows the same copy rules as everywhere else: no invented quotes, people, prices or numbers. See AI.

The command palette

Press ⌘K (Ctrl+K on Windows and Linux) or click ⌘K in the top bar. Type to filter, use the arrow keys, and press Enter to run. The palette can add any section, go to a page, open an inspector tab, switch the preview device, save, undo, redo, publish, send for review, and duplicate, delete or move the selected section.

The command palette

The editor: pages and sections on the left, canvas in the middle, inspector on the rightThe canvas at mobile width

05The section library

Add section lists every section with a live thumbnail drawn in the site's own theme, and the number of layouts. Sections that should hold only real facts carry the tag Needs your real data. New sections are added below the selected section, or above the footer when nothing is selected.

SectionLayoutsWhat it is
NavigationSimple, Centered logoLogo, page links and a call to action; optional language switcher.
HeroCentered, Split with image, Full image, Image with fact cards, Moving headlineThe first thing a visitor sees: headline, promise, action.
Client namesRow, Moving bandClient or partner names (text, not logos). Real data.
FeaturesGrid, Alternating with images, Bento, Sticky headingWhat you offer, as short cards.
AboutImage right, Image leftYour story with an image.
ServicesCards, List, Work with imagesServices or products with optional prices. Real data.
NumbersRow, Big bandYour own figures. Empty until you add real ones. Real data.
StepsNumbered, TimelineHow it works, in order.
TestimonialsCards, One big quote, Wall of quotesReal quotes from real clients only. Real data.
PricingCards, Monthly / yearly switchPlans with prices you set. The switch shows a second price and period per plan. Real data.
FAQAccordion, Two columnsQuestions visitors ask before they buy.
Call to actionBanner, Split, Newsletter sign-upA banner that asks for the next step. The newsletter layout is an e-mail field; see below.
GalleryGrid, Masonry, Before and after sliderImages. The slider compares the first two images.
TeamGridThe real people behind the business. Real data.
Contact formForm and details, Form onlyA form that lands in the forms inbox, plus contact details. Fields: name, e-mail, message, optionally phone.
TextNarrow, WideFree text: headings, paragraphs, lists, links.
LocationCard, With mapAddress, opening hours and a map link. With map shows a Google map that loads only when the visitor clicks Show the map.
BookingCalendar on the page, ButtonA Cal.com or Calendly booking page. See below.
Latest postsCards, ListThe newest published blog posts (1 to 12) with a link to the blog.
VideoWide, With textA YouTube or Vimeo video. See below.
FooterColumns, MinimalBrand, links and the small print.

Newsletter sign-up. Each sign-up arrives in the site's forms inbox (and the form webhook, if set) as a message "Newsletter sign-up" with the visitor's e-mail. Kiln does not send newsletters and does not manage unsubscribes: export the addresses or pass them to your mailing tool, and change the small print under the field so it says what really happens.

Booking. Paste the address of a Cal.com or Calendly booking page (https://cal.com/…, https://app.cal.com/… or https://calendly.com/…); other addresses are ignored and the button stays inactive. Calendar on the page loads the calendar only after the visitor clicks the button; Button opens the booking page in a new tab.

Video. Paste a YouTube link (watch, shorts, youtu.be or embed) or a Vimeo link. The page shows the cover image and a play button; the player loads only when the visitor clicks. YouTube plays from youtube-nocookie.com, Vimeo with its do-not-track option. Any other link plays nothing.

06The Section tab (inspector)

  • Move up / down, duplicate, delete buttons.
  • Rewrite this section (when AI is set up): type what should change or pick a suggestion, then Rewrite. The button shows the cost and your balance. Only this section changes; Undo restores the old text.
  • Layout: the section's layouts.
  • Content fields: generated from the section type: text, multi-line text, rich text (bold, italic, link, list), links (label and address), toggles, lists of items, and images. An image field opens the picker: Library (uploads: PNG, JPEG, WebP or GIF up to 8 MB), Stock photos (Pexels) and Generate with AI (OpenAI). Give every image an alt text: the checks flag missing ones.
  • Background: Plain, Soft, Brand or Dark. Spacing: Tight, Normal or Airy.
A section selected on the canvas with its fields in the Section tab

07Theme

  • Sixteen style presets: Studio, Noir, Bloom, Atelier, Clinic, Forge, Orchard, Pulse, Ledger, Concrete, Linen, Arcade, Lumen, Terra, Sorbet and Onyx. A preset replaces the whole theme; adjust it afterwards.
  • Colours: background, soft background, text, secondary text, brand colour, text on brand colour, accent. Contrast problems are shown as warnings.
  • Type: heading and body font (28 fonts, including two system fonts) and heading size (compact, balanced, dramatic). Load web fonts (Bunny Fonts) can be turned off to use system fonts only.
  • Surface: how cards look: Flat, Lines (thin borders), Bold shadow or Glass. Texture: No texture, Grain or Grid on the page background.
  • Shape: corner radius (0–32 px) and button style (solid, outline, pill).

Moving bands (hero, client names) and the reveal animation stand still for visitors whose system asks for reduced motion.

Theme tab with the sixteen style presets

08Page and SEO

The Page tab holds the settings of the open page and of the whole site.

Per page: name (in the menu), address (lowercase letters, digits and dashes), SEO title (aim for up to 65 characters; empty uses "<page> | <site>"), description (up to 160; empty uses the hero text), share image, and Hide this page from search engines. Per site: site name, favicon, site share image and Kind of business (structured data). If the operator allows it, a field for code in <head>.

Published pages carry canonical links, Open Graph and Twitter tags, structured data, hreflang links, a sitemap and robots.txt.

Contact buttons and announcement

  • WhatsApp number: international format, digits only (for example 421900123456). Shows a floating WhatsApp button that opens wa.me.
  • Call button number: shows a floating call button (tel: link).
  • Announcement bar and Announcement link: one line of up to 160 characters at the top of every page, optionally linked.

Form webhook

Send form messages to a webhook takes an https:// address, for example from Zapier, Make, n8n or a CRM. Every message from the site's contact and newsletter forms is then also posted there as JSON:

{ "site": "Northside Bakery", "siteId": "s_…", "page": "/contact/", "receivedAt": "2026-11-09T10:00:00.000Z",
  "fields": { "name": "…", "email": "…", "message": "…" } }

The message is stored in the inbox first; the webhook call does not hold up the visitor. Kiln does not retry a failed call and does not follow redirects. An address that is not https:// is dropped when the site is saved. For a published site, Kiln uses the webhook of the published version: publish again after you change it. The rules are in Security.

Enter the client's own ids; Kiln adds the tracking code to the published site:

FieldFormat
Google Analytics 4Measurement id, G-XXXXXXX
Google Tag ManagerContainer id, GTM-XXXXXX
Plausible domainThe site's domain as set up in Plausible, e.g. bakery.example
Meta Pixel idDigits only

An id that does not match its format is dropped when the site is saved. Tracking code never runs in the editor canvas.

Ask visitors for cookie consent first (EU) adds a banner with your text, Accept and Decline buttons and an optional privacy policy link. With the banner on, Google Analytics, Google Tag Manager and the Meta Pixel load only after the visitor clicks Accept. Plausible sets no cookies and always loads. The visitor's choice is remembered in their browser. The banner appears only when at least one analytics id is set.

09Blog

Editing a blog post

The Blog tab adds a blog to the site.

  • Blog on this site turns it on. Blog name and Intro head the blog page.
  • New post creates a draft. Each post has a title, an address (/blog/<address>/; it follows the title until you edit it), a date, an author, a cover image, a summary (shown on cards and in search results) and the article in rich text. While you edit a post, the canvas shows it.
  • Published makes the post part of the site. Like every change, it goes live when you publish the site.
  • Draft a post with AI (when AI is set up): give a topic and Kiln writes a draft of 600 to 900 words at the page price in credits. The draft is saved unpublished. The AI does not invent quotes, studies, statistics or prices; it writes [placeholders] where a real fact is needed. Read the draft and replace them.

With at least one published post, the published site gets a blog page at /blog/, one page per post at /blog/<address>/, a Blog link in the navigation, entries in the sitemap and BlogPosting structured data on each post. The Latest posts section shows the newest posts on any page. The blog uses the home page's navigation and footer and is in the site's main language only.

10Languages

Languages tab: Add a language (21 are available). Each extra language gets its own addresses (/de/…). Choose Edit next to a language, then edit sections as usual: the main language's text shows as a hint. Translate fills a language with AI, at the translate price per page. You can always type translations by hand. Structure (adding or moving sections) is edited in the main language only.

11Checks

The score in the top bar is the share of checks that pass. The Checks tab lists what to fix; click an item to jump to it. Checks cover: page title and description length, duplicate titles, a hero headline (the page's H1), images without alt text, placeholders like [Client name] (shown as errors), untranslated sections, theme contrast, and whether the site has a contact form.

Checks tab with the score and the list of issues

12History

A restorable snapshot is kept at most every 10 minutes while you edit, and at named steps such as generation and restore. Restore brings a version back; the current version stays in the history.

13Forms inbox

Messages sent through the contact and newsletter forms of the published site appear in the Forms tab, newest first, with Mark all read and a CSV download. Workspace owners also get an e-mail per message if the operator has e-mail set up, and the form webhook receives a copy if one is set.

Forms tab with a message and the CSV download

15Publishing

Publish opens the dialog. It warns when placeholders are still on the site.

  • Built-in hosting: Publish / Publish changes. The address is shown in the dialog. Owners can Unpublish.
  • Your Cloudflare account: Deploy / Deploy again, when the plan and the operator allow it. See Publishing to Cloudflare.
  • Custom domains (owners, when the plan allows): enter the domain, choose built-in hosting or Cloudflare, Add domain, and follow the instruction shown. A built-in hosting domain shows Waiting for DNS until you add the TXT and CNAME records shown and press Verify; then it shows Active. A Cloudflare domain is attached at once. See Hosting.
Publish dialog with a placeholder warning, built-in hosting, Cloudflare and code export

16Export

Under Take the code (when the plan allows):

  • Static HTML (.zip): one index.html per page in its own folder (for example an about folder), language folders, the blog, assets/, media/, sitemap.xml, robots.txt, 404.html and a README. Upload the folder's contents to any static host.
  • Astro project (.zip): one .astro component per section, a layout, astro.config.mjs, the images and a README. It needs Node.js 22.12 or newer. Run npm install and npm run build; the site is in dist/ (npm run dev previews it at http://localhost:4321). The Astro project holds the pages and their sections only: the blog, the announcement bar, the floating WhatsApp and call buttons, the analytics and the consent banner are not in it.

In both, the contact and newsletter forms keep posting to your Kiln server, so messages still arrive in the forms inbox.

17Keyboard shortcuts

On a Mac use ⌘ (Command); on Windows and Linux use Ctrl. They also work while the canvas has focus.

KeysAction
⌘K / Ctrl+KOpen or close the command palette (works while typing in the inspector)
⌘S / Ctrl+SSave now (works while typing in the inspector)
⌘Z / Ctrl+ZUndo
⇧⌘Z / Ctrl+Shift+Z, or Ctrl+YRedo
⌘D / Ctrl+DDuplicate the selected section
⌥↑ / Alt+↑Move the selected section up
⌥↓ / Alt+↓Move the selected section down
Delete or BackspaceRemove the selected section

Except for the palette and save, shortcuts do nothing while the cursor is in a text field of the inspector. While a text on the canvas is being edited, no shortcut runs: press Enter or Esc first.