Real design files
Auto layout, components with variants, color variables with modes, text styles, Google Fonts, icons, photos. Saved as .facet on your Mac.
Claude designed Vesper, a whole festival brand, in Facet (the Mac design app your AI can work in) from a one-line brief and a few rounds of feedback. Facet builds Claude's 10 calls into editable layers in 2.3 seconds.
Every pixel is a real layer: auto layout, components, variables, a licensed photo toned with a blend mode.
The same screen, the same layers. One variable mode switched.
Ask Claude, Codex or Cursor for a screen, a component or a whole brand, and watch it appear on the canvas as real layers you can keep editing by hand. Every change is one undo step, with its author's name on it.
Download Facet, drag it to Applications, open it. No account, no sign-in.
One click adds Facet to Claude, Claude Code, Codex, Cursor or VS Code.
Describe what you want. It appears live, layer by layer, while you keep working.
Auto layout, components with variants, color variables with modes, text styles, Google Fonts, icons, photos. Saved as .facet on your Mac.
Every write verifies itself and reports, by layer, what did not happen: overflow, overlap, a missing font. Your AI fixes it before you see it.
An agent's build runs on a copy and lands whole, so you keep panning, zooming and drawing. Undo takes back any call.
Devanagari, Arabic, CJK and the rest, shaped properly, in any of Google's fonts.
3,245 layers built in 2.3 s. Exports render on every core. Large files open without freezing the window.
Notarized by Apple, and every update is verified against Facet's signing key before it installs.
Your AI writes short descriptions in Facet's build language; Facet turns them into layers, measures them, checks them and says what did not work. A whole screen is one call. This is part of the Tonight screen above, as Claude wrote it:
[
{
"width": "fill",
"gap": 10,
"row": [
{
"name": "Doors",
"width": "fill",
"padding": 14,
"gap": 2,
"cornerRadius": 20,
"fill": "@surface",
"stroke": "@line",
"strokeWidth": 1,
"column": [
{
"row": [
{"icon": "lucide:door-open", "size": 15, "color": "@coral"},
{"text": "DOORS", "style": "label", "color": "@soft"}
],
"gap": 6,
"align": "center"
},
{"text": "Open", "font": "Unbounded 20/26 700"},
{"text": "Gate B is quickest", "style": "small", "color": "@soft"}
]
},
"…"
]
},
{
"Artist": {
"State": "Saved",
"Name": "Mira Solenne",
"Initials": "MS",
"Time": "22:40",
"Stage": "River"
},
"width": "fill"
}
]
For Mac with Apple silicon, macOS 13 or later.
Download for Mac