FacetDocs

Your first design

The quickest start is the sample: a small screen left half-finished on purpose, so there is something to explore and something to ask for.

With your AI

  1. On the welcome screen, choose Start with a sample. Facet saves it as Documents › Facet › Welcome.facet and opens it.
  2. If you have not yet, connect your assistant: Facet › Connect AI Apps… (Connect your AI).
  3. In Claude, ChatGPT or Cursor, ask for something on the open design, for example:

> Use Facet to add a pricing card to my open Welcome design.

Your assistant edits the file you have open. Its changes appear on the canvas as it works, with its name beside them, and every change it makes is one step you can undo with ⌘Z.

By hand

Everything an assistant does, you can do on the canvas: select, move, resize, edit text, change colors in the inspector on the right. View › Command Palette lists every action with its shortcut.

From the command line

The facet command builds designs from a short JSON description, the same way assistants do. Install it once with Facet › Install Command Line Tool… (The command line).

hello.json≈ 89 tokens
{
  "name": "Hello",
  "column": [
    "Evening practice",
    {
      "text": "Twelve days in a row",
      "color": "#6F6879"
    }
  ],
  "font": "Inter 15/22",
  "padding": 20,
  "gap": 4,
  "fill": "#FFFFFF",
  "cornerRadius": 14,
  "width": 260
}
What hello.json builds

A card is a column with two texts. The container's font reaches every text inside it, so the texts are plain strings.

Built by the docs build with the real CLI.

facet --doc practice.facet build @hello.json --preview hello.png

Every command takes --doc FILE. If Facet has the file open, the command edits it there and you see the change live; otherwise a helper in the background opens the file, saves after every change and stops when you run facet --doc practice.facet close.

--preview writes a picture of what was built. The reply lists every layer by name, and any warning names the layer and the fix. Three commands read what is there: tree lists layers with their sizes, inspect NODE shows one layer, and shot NODE -o card.png --scale 2 renders it.

facet open practice.facet

opens the file in the app as a tab.

Next