Makeables

Design cards, badges and stickers with editable layers, live materials and your coding agent. Requires Node.js 22+.

npx skills add crafter-station/makeables-community --skill makeables --global

The skill checks for Makeables 0.4.0+ and installs or updates the CLI when authorized. To set up the CLI directly:

npm install --global makeables
makeables skills get core

Ask: “Use the makeables guide. Make an experimental badge from my photo at ~/Pictures/me.png. Show me both sides, then let’s refine it here.”

For personalized badges, the guide asks for a photo if one is missing. It prefers native widget or browser inspection; agent-browser is optional. Cards and stickers do not need a portrait. It offers ai-cli only when a requested image transformation needs it. Image generation uses your own AI Gateway credentials and credits.

Cards from the terminal

makeables designs list
makeables new card --design checkpoint --out card.json
makeables layer add --file card.json --sticker petdex:boba
makeables render --file card.json --out card.png

Rendering runs in Node with no browser. All 23 card styles include editable fronts and backs. The 20 curated fronts retain their original SVG elements, gradients, filters and embedded images; each has a new reverse. --style checkpoint and --design checkpoint select the same layered document. makeables skills get cards has the full guide.

For new credit-card designs, the guide defaults to a complete issuer identity with chip, contactless and payment-network marks, plus coordinated front/back layouts, typography, colors and materials. It uses the requested bank or creates a fictional issuer suited to the brief. Artwork-only requests and focused remixes retain their scope and original SVG elements without duplicate marks.

Use makeables studio start --product card for live WebGPU materials and lighting. Flat Artwork PNG, material Preview PNG and editable JSON are separate exports; the website does not modify Wallet.

Versioned instructions

makeables skills get core
makeables skills get cards
makeables skills get badges
makeables skills get stickers
makeables skills get kits
makeables skills get sheets
makeables skills get images
makeables skills get wallet
makeables skills get core --full
makeables doctor --json

The installed skill is a small discovery stub maintained in makeables-community. These guides and image-transfer helpers are bundled into the CLI, so no repository checkout or external skill script is required. Report bugs and feature requests in the community issue tracker.

Embedded MCP App

The skill chooses MCP Apps → built-in browser → CLI + inline PNG, based on capabilities actually available in the coding session. It does not open an external browser or install another integration to produce a preview.

To connect the optional stdio server, use your host's MCP configuration with an existing directory dedicated to your designs:

{
  "mcpServers": {
    "makeables": {
      "command": "makeables",
      "args": ["mcp", "--root", "/absolute/path/to/designs"]
    }
  }
}

The exact configuration location depends on the host. Start a new host session if required; having the CLI installed does not register its MCP tools. makeables_preview exposes a self-contained MCP App: front/back, text and sticker-finish controls, plus host-mediated PNG, JSON and portable-package exports. The file is the state, shared with the CLI. Revisions reject stale edits. File access stays inside --root; there is no cloud service, login, localhost fetch or publication tool. Cards and badges show flat artwork; stickers use the same material PNG renderer as the website. A personalized badge opens from a complete package containing its portrait and participant.

Hosts without MCP Apps receive text and a PNG from the same preview tool. A host without downloads can keep the local file and use CLI exports. To inspect the full layer editor or animated materials, continue with the same design in the built-in browser.

makeables render --file design.makeables.json --out preview.png also exports the validated PNG from an editable portable package, keeping its portrait and other assets intact.

One live browser preview

makeables studio start

This prints a local URL without opening a browser. An agent with a built-in browser panel opens that URL there. Keep the process running and reuse that tab while iterating. --open explicitly opts into the operating system’s default browser; --no-open remains supported. If there is no built-in browser, use CLI rendering and show the resulting image in the conversation.

The local preview embeds the real badge editor card editor or sticker editor. Its local connection uses the same tools, revision checks and validation as native WebMCP. It works without native WebMCP in the preview browser. One tab owns a session; no separate browser-state synchronization is implied.

makeables studio tools --url "$MAKEABLES_URL" --json
makeables studio call badge_inspect --url "$MAKEABLES_URL" --params '{"section":"state"}' --json
makeables studio stop --url "$MAKEABLES_URL"

Treat the full local session URL as private. The server binds to loopback, authenticates calls, validates browser origins and keeps pending calls in memory. It does not provide cloud storage. A disconnected or timed-out call may have completed; inspect before retrying. Browser panels may partition storage, so export work you need outside the session.

Documents and images

makeables styles list
makeables design create --style gtm --out badge.json
makeables schema --json
makeables design validate --file badge.json
makeables image params --file photo.png --state state.json > image-params.json
makeables image extract --file image-response.json --out portrait.webp

The catalog designs are starting points. Your agent can compose both faces, move and reorder layers, change typography, graphics, portrait treatments and material effects using the full schema. The CLI renders flat artwork in Node; the live editor also renders material previews. Neither calls an image model automatically. Badge portraits and shared custom artwork are separate from exported design JSON; embedded card assets and original SVG image bytes remain in the card document.

Most commands return {ok:true,version,data,nextSteps} or {ok:false,version,error,nextSteps}. JSON is automatic when piped. skills get returns plain Markdown unless --json is explicit. image params returns the raw invocation object so it can be passed directly with --params @file. Exit codes are 0 success, 2 invalid input or a rejected editor call, and 1 system failure. File outputs are exclusive and never overwrite existing files.

Publish with your agent

For every product, your agent saves a complete portable package before submission. Badge packages also contain participant details and a portrait; cards and stickers do not need them:

makeables studio save --url "$MAKEABLES_URL" --out badge.makeables.json
makeables submit --file badge.makeables.json --dry-run
makeables submit --file badge.makeables.json --yes
makeables submit status --file badge.makeables.json

--yes means you approved sharing this exact design and its included images and data. Submission runs directly from the package, even after the editor closes. Retries reuse the same operation and receipt. A pending receipt means private admin review; the design becomes public only after approval.

The first submission opens Clerk device login in your default browser and continues automatically once you connect. The upload continues from the CLI. Subsequent submissions reuse the OS credential store. makeables login --no-open prints the verification link for a session browser; makeables logout revokes the connection. MAKEABLES_TOKEN supports existing OAuth access tokens in headless environments. Credentials never appear on stdout or in the local operation log.

Creation, local saving, editing and export remain anonymous. --dry-run validates the actual bundle without authentication or network calls. MAKEABLES_DISABLE_PUBLISH=1 disables public writes. MAKEABLES_STATE_DIR overrides the local operation/receipt directory; keep it private. JSON progress events are on stderr; the final result and durable receipt are on stdout.

The existing editor tools still support author-only updates and withdrawal. Your agent verifies the public link before calling publication complete.

The package and command are makeables. Proprietary software by Crafter Station; see LICENSE for the terms of use.

Cards from references and Wallet

Makeables 0.2.0 includes the complete reference workflow in skills get cards. Import supported original SVG elements as layers, or keep a supplied raster as an image layer. Local image tools prepare, measure, selectively trace, rotate and compare references without a private checkout. Only tracing needs optional potrace on PATH.

makeables new card --file artwork.svg --out card.json
makeables validate --file artwork.svg --out preview.png
makeables image compare --file artwork.svg --ref reference.png --out comparison.png

At a ready card preview, the agent offers to keep iterating, submit to the gallery, or install the artwork on the phone. Cards, badges and stickers share /submit and makeables submit; publish is an alias. Editable layers, both faces and assets stay together. Choosing installation loads makeables skills get wallet.

# Existing public card + previously confirmed saved target:
makeables wallet install --submission "https://makeables.dev/make/card?submission=UUID" --target mercury-4535 --yes --json
# First selection, with a user-confirmed label to remember after installation:
makeables wallet install --submission UUID --remember mercury-4535 --label Mercury --last4 4535 --json
# Local documents and complete packages also work:
makeables wallet install --file card.json --json
# Wait for selection-ready before asking the user to tap. Inspect the preview.
makeables wallet install --assets "/returned/prepared/assets" --card c-SELECTION --remember mercury-4535 --label Mercury --last4 4535 --yes --json
makeables wallet targets list --json
# Register an existing verified backup without touching the phone:
makeables wallet targets add --target mercury-4535 --backup b-BACKUP --label Mercury --last4 4535 --yes --json
# Reuse the backupId from the installation receipt when restoration is requested.
makeables wallet restore --backup b-BACKUP --yes

Public submissions download directly with a bounded timeout and validated file hashes. Receipts include a real local package path, byte count and checksum. Raw card JSON, {design: ...} documents and portable JSON/ZIP packages are accepted. The complete artwork is preserved, including vectors and text. wallet prep --submission UUID --out <directory> prepares without a phone write.

Wallet runs on a Mac with a USB-connected iPhone. install prepares once, returns the next selection step when needed, and applies only with an explicit --target, --card or --backup plus --yes. Reuse --assets to avoid rendering again. If saved targets exist and no target is specified, it returns needs-target with labels to choose from. Use --scan to select a different card. Names and optional last four digits are user-confirmed labels, not details retrieved from iOS. The scanner exposes opaque selections only. Each saved alias binds to a verified original backup; the helper checks device/card binding again before writing. Duplicate aliases fail before installation. wallet targets remove --target <alias> removes only the label, preserving its backup. targetSaved: false alongside status: complete means artwork installation succeeded but the label needs saving; do not repeat the write. With a capable companion, selection finishes on the first card event and installation reuses its Media connection. Older companions retain a full scan. Progress appears on stderr; stdout contains the result, backup verification and timing. A failed device operation is never automatically retried. selection-ready appears only after the activity stream handshake succeeds; ask the user to tap at that point. wallet install --help shows only that command's syntax. JSON result fields live under data.

Capable companions also reuse the connection during restoration and batch removal of added artwork. Restore reports each phase, file counts and the verified original backup. Apply returns a restore handoff; both operations save private receipts. wallet backups --backup b-BACKUP retrieves the current backup status and its last completed operation without a card scan. A saved success may predate a later failure. Transport durations are part of phase timings, not extra time to add to the total. A CLI-only update does not replace the companion; check wallet doctor capabilities when diagnosing old behavior.

Setup downloads a versioned, checksum-verified companion containing the runtime, native bridges and artwork exporter; no source checkout or developer toolchain is required. apply changes the artwork of a selected existing card; restore removes that custom design using verified issuer artwork. Neither provisions nor deletes payment cards.

Original backups live privately in ~/Documents/Makeables/Wallet Backups/; operational state lives in ~/Library/Application Support/Makeables/Wallet/. Updates do not remove these files. wallet doctor reports the companion's state without touching a device. MAKEABLES_WALLET_HELPER selects a compatible local companion for development; MAKEABLES_WALLET_HOME and MAKEABLES_WALLET_BACKUPS override its private storage locations.

Wallet artwork changes use experimental, unofficial device services. Apply and restoration have been tested on a Wallet card. The September 30, 2026 restore used companion 0.2.0's one-shot transport and was visually confirmed by the user. The optimized persistent/batched path still needs device validation; this is not a broad compatibility or speed guarantee. Keep the original backups and inspect the guide before device work.

Share any design

makeables submit --file card.json --dry-run
makeables submit --file card.json --yes --credit "Your name"
makeables submit status --file card.json --credit "Your name"

submit accepts layered JSON, original card SVGs, legacy badge bundles and portable .makeables.zip or .makeables.json packages. publish is the same command. In the editor, Submit opens the shared preview and credits form; no manual ZIP assembly is necessary. Sign-in preserves the draft. Submissions are private while pending and become public after approval. All three products are reviewed at /admin, available in the user menu for database-authorized admins.

See the portable format for package limits and assets.

Stickers

makeables studio start --product sticker prints the URL for the same Design Studio and CLI bridge. makeables new sticker --style typingmind-absolutely-right --out sticker.json creates the shared document. Use makeables skills get stickers for material editing, PNG/JSON export and the common submit --dry-run / consent / review lifecycle. Sticker packages contain a transparent material preview and editable layers, with no participant data.

Complete kits

makeables skills get kits covers creating a collection from existing editable pieces or a raster artwork sheet. kit render composes native previews, kit export writes one validated portable ZIP, and kit import reopens it. submit --file kit.makeables.zip --yes sends the whole collection for one review. Creating, importing, rendering and exporting do not require authentication.

Use render --appearance material for static sticker finishes or --appearance flat for artwork. Use --compact for small machine receipts. Optional --trace ./session.jsonl writes private local command timing; MAKEABLES_TRACE_SESSION groups multiple invocations under one opaque run ID.