{"id":81856,"plugin_id":"plugin_asdk_app_6ad7a6e23400819198e9cc963ee1da61","kind":"skill","collection_source":"plugin_package","comparison_source":null,"observed_at":"2026-11-05T01:19:13.303Z","digest":"049af2701ccf9b7d6c5ebf238a01588931a631c4848fa21959492ad51df510cb","against":null,"payload":{"description":"Make, edit and animate SVG files with Visual Sandbox. Trigger when the user asks for an SVG, a vector, a logo, an icon, an animated logo or loading state, a cut file (Cricut, laser, CNC, embroidery), or wants to \"vectorize\" a raster image via the vsb CLI. `vector/quiver-arrow-2` is the default: it writes an SVG from a prompt, vectorizes a raster, edits an SVG you already have, and animates one into a loop. For a detailed illustration, generate a flat raster with an image model first and trace it with `vector/recraft-vectorize`. Always ask the user how many colours the SVG must have before you run anything.\n","included_files":[{"relative_path":"agents/openai.yaml","size_in_bytes":280}],"name":"vsb-vector","skill_md_contents":"---\nname: vsb-vector\ndescription: >\n  Make, edit and animate SVG files with Visual Sandbox. Trigger when the\n  user asks for an SVG, a vector, a logo, an icon, an animated logo or\n  loading state, a cut file (Cricut, laser, CNC, embroidery), or wants to\n  \"vectorize\" a raster image via the vsb CLI. `vector/quiver-arrow-2` is\n  the default: it writes an SVG from a prompt, vectorizes a raster, edits\n  an SVG you already have, and animates one into a loop. For a detailed\n  illustration, generate a flat raster with an image model first and\n  trace it with `vector/recraft-vectorize`. Always ask the user how many\n  colours the SVG must have before you run anything.\nlicense: Proprietary. See LICENSE for the terms.\n---\n\n# Vector generation with vsb\n\n> **On the MCP surface?** If the `visual-sandbox` MCP tools are in your\n> tool list, use `generate` and `get_job` instead of the shell commands\n> below. The route choice and the prompt craft on this page still apply.\n> See `vsb` → Two ways to run.\n\nFive live models. Verify with `vsb models --modality vector --json` before\nyou trust this table.\n\n| Slug | Input | Cost | Good for |\n|------|-------|------|----------|\n| `vector/quiver-arrow-2` | prompt, or prompt + images, or image only, or `svg` (+ prompt) | ~$0.07 an icon, ~$0.60 a dense illustration, ~$0.03 an edit or an animation | **The default.** Icons, glyphs, monoline marks, simple logos. The only family that edits and animates an SVG you already have. |\n| `vector/quiver-arrow-2-telos` | same as Arrow 2 | ~$0.10 an icon, ~$0.90 a dense illustration, ~$0.04 an edit or an animation | Arrow 2 plus a frontier reasoning model. A diagram whose logic must hold, an infographic from real figures, a mark that must obey a page of brand rules. Reads about eight times as much brief. |\n| `vector/quiver-arrow-1.1` | prompt, or prompt + reference images, or image only | $0.25 a generate, $0.19 a vectorize, flat | Only when a dense illustration must land on a known flat price. Cannot edit and cannot animate. |\n| `vector/recraft-v4.1-svg` | prompt only, plus `aspect_ratio` | ~$0.05 per SVG, flat | Recraft. A new SVG from a prompt at one low price, even for a dense illustration, with Recraft's composition and colour. **No reference images, and it cannot edit or animate.** About 20 seconds. Commercial use allowed. |\n| `vector/recraft-vectorize` | one raster image | ~$0.02 per SVG | Tracing any raster into editable paths. The second half of the illustration route. |\n\n**The Arrow 2 family is token-billed**, so the price moves with how much\ndrawing the model does. `vsb pricing` shows a ceiling, and the user is\ncharged for what the model actually produced, never more than the quote.\nArrow 1.1 and Recraft V4.1 SVG are the flat-price generators.\n\n**Do not pick Telos for an icon.** It draws the same shapes as Arrow 2 and\ncosts half again as much. Pick it when the thinking is the hard part.\n\nStart every run in a **background shell** (Claude Code: `run_in_background:\ntrue`). All five models are sync. Recraft Vectorize finishes in seconds and\nRecraft V4.1 SVG in about 20; the Arrow 2 family takes about a minute, and\nTelos longer. Rules in\n`vsb` → Background generations.\n\n## Ask first, then route\n\nAsk these two questions in one message before any run:\n\n1. **How many colours?** One, two to three, four to six, or full colour.\n2. **Background?** Transparent, or a solid colour.\n\nIf the user says \"whatever\", use four to six colours on a white\nbackground and say so.\n\nThen pick the route:\n\n| The request is | Route |\n|----------------|-------|\n| An icon, a glyph, a monoline mark, a simple logo, one to three colours | **A. Quiver direct** |\n| A scene, a character, a mascot, a poster, shading, four or more colours, or \"detailed\" | **B. Raster first, then vectorize** |\n| The user already has a raster (PNG, JPG, a sandbox node) | **C. Vectorize only** |\n| The user has an SVG and wants it changed (\"recolour it\", \"thicken the strokes\", \"add a badge\") | **D. Edit an SVG** |\n| The user wants a logo, a loader or a mark to move | **E. Animate an SVG** |\n\nOnly the colour question applies to routes A, B and C. Routes D and E\nstart from an SVG, so its palette is already decided.\n\nQuiver is not the default for a picture. It draws clean icons and falls\napart on detail: a busy illustration comes back simplified, with merged\nshapes and dropped elements. That is the case for route B.\n\n## Route A: Quiver direct\n\n```bash\nvsb run vector/quiver-arrow-2 \\\n  --prompt \"A paper plane icon. Flat geometric style, thick uniform 2px strokes, rounded joins. Exactly 2 colours: navy #1B2A49 and white. No gradients, no shading, no text. Centred, transparent background.\" \\\n  --json\n```\n\nPrompt order: subject, style, palette, background. Say the colour count\nas a number and name the colours. Words that keep the output simple:\nflat, minimal, geometric, line art, monoline, single colour, thick\nstroke.\n\n- One mark per generation. For an icon set, run once per icon with the\n  same style sentence, so the set reads as a family.\n- `images` is a list. Prompt + images = style or structure reference.\n  Images with an empty prompt = vectorize the first image (route C, but\n  Quiver is several times the price of Recraft for that job).\n- `--reasoning_effort` takes `low`, `medium`, `high`, `xhigh`. Leave it\n  alone for a single glyph. Raise it when the layout is the hard part.\n  Higher effort spends more tokens, so it costs more.\n- Arrow 2 rejects `temperature`, `top_p` and `presence_penalty`. Those\n  were Arrow 1.x knobs. `reasoning_effort` replaced them.\n- Swap in `vector/quiver-arrow-2-telos` when the brief is long or its\n  logic has to hold. Paste the whole brand guide or data table in rather\n  than summarising it; reading it is what you are paying for.\n\n## Route B: raster first, then vectorize\n\nRecraft traces what it sees, so the palette and the background are set\nin the raster prompt. Read\n[`vsb-image-prompting`](../vsb-image-prompting/SKILL.md) before you\nwrite it.\n\n```bash\n# 1. Flat raster. PNG is mandatory: JPG artifacts trace into hundreds of stray paths.\nRASTER=$(vsb run image/nano-banana-2 \\\n  --prompt \"Flat vector illustration of a fox reading a book under a tree. Exactly 5 colours: burnt orange #E0642B, cream #F6EFE3, forest green #2F5D3A, dark brown #3B2A1A, sky blue #BFD8E6. Solid fills only. No gradients, no shading, no texture, no outlines, no noise. Clean hard edges. Subject centred with margin. Plain white background. No text, no watermark.\" \\\n  --aspect_ratio 1:1 --output_format png --json | jq -r '.result.urls[0]')\n\n# 2. Trace it.\nvsb run vector/recraft-vectorize --image \"$RASTER\" --json\n```\n\n- **Transparent background wanted?** Run\n  `image-enhance/recraft-remove-background --image \"$RASTER\"` between\n  step 1 and step 2, and trace its output instead. PNG transparency\n  survives the trace.\n- `image/nano-banana-2-lite` is fine for a draft. Use `image/nano-banana-2`\n  for the final, since every edge becomes a path.\n- Keep the raster square unless the user asked for another shape.\n- This is one chain, not two. Do not feed the SVG, or the traced raster,\n  back into an image model. Change the prompt and rerun step 1 instead.\n- One step instead of two: `vector/recraft-v4.1-svg --prompt \"...\"` draws\n  the SVG directly at a flat price. Use the same palette and background\n  sentences. It takes no reference image, so the two-step chain stays the\n  route when the user supplies a style or a character to match.\n\n## Route C: vectorize only\n\n```bash\nURL=$(vsb upload ./logo.png --json | jq -r '.url')\nvsb run vector/recraft-vectorize --image \"$URL\" --json\n```\n\nFor a node on the canvas, take `output_urls[0]` from\n`vsb sandbox selection --json` as the `--image` value.\n\n## Route D: edit an SVG that already exists\n\n`svg` plus a prompt edits. The Arrow 2 family only; Arrow 1.1 and Recraft\nhave no `svg` field at all.\n\n```bash\nSVG=$(vsb run vector/quiver-arrow-2 --prompt \"...\" --json | jq -r '.result.urls[0]')\n\nvsb run vector/quiver-arrow-2 \\\n  --svg \"$SVG\" \\\n  --prompt \"Make the star rounded and fill it #FFD700. Leave everything else as it is.\" \\\n  --json\n```\n\n- `--svg` takes a URL, a data URI, or raw markup. A sandbox node works:\n  pass its `output_urls[0]`.\n- Name what changes and say the rest stays. The model reads the real\n  paths, so an unmentioned shape survives the edit.\n- The edits endpoint reads at most 200,000 characters of markup and takes\n  at most 4 reference images. Generate takes 16. A traced photo usually\n  blows the character cap; edit the source raster instead.\n- An edit is the cheapest thing the family does. Iterating on one mark\n  beats regenerating it.\n\n## Route E: animate an SVG\n\n`svg` with **no** prompt animates. The output is a looping SVG with the\nloop written into the file, so it plays in a browser with no JavaScript\nplayer and no video file.\n\n```bash\nvsb run vector/quiver-arrow-2 --svg \"$SVG\" --json\n\n# Steer what moves. --operation animate is required here:\nvsb run vector/quiver-arrow-2 \\\n  --svg \"$SVG\" \\\n  --prompt \"Spin the outer ring clockwise, forever. Hold the wordmark still.\" \\\n  --operation animate \\\n  --json\n```\n\n- Careful: a prompt plus `svg` and nothing else **edits**, it does not\n  animate. `--operation animate` is what makes the prompt steer a loop.\n- Animate a tidy SVG. A mark Arrow 2 drew animates reliably; a traced\n  photo or a file with no grouping gives the model nothing to grab.\n- Good jobs: a logo reveal in a site header, a loading bar, an empty\n  state, an icon micro-cue, a product illustration that needs some life.\n- The file is a few kilobytes and needs no player, which is the whole\n  reason to reach for this over a hand-built animation.\n\n## Hold the colour count\n\nRecraft has no palette setting. Check the SVG, then fix the raster if it\nis over.\n\n```bash\n# Distinct fills in the SVG. Download to a scratch dir; this is a check, not a user save.\nvsb run vector/recraft-vectorize --image \"$RASTER\" \\\n  --download \"/tmp/vsb-vector/{request_id}.svg\" --json > /tmp/vsb-vector/run.json\ngrep -o 'fill=\"[^\"]*\"' /tmp/vsb-vector/*.svg | sort -u | wc -l\n```\n\nIf the count is over the target, or the SVG is bloated with near-duplicate\ntints, posterize the raster and trace again. The retrace costs one cent.\n\n```bash\nmagick /tmp/vsb-vector/raster.png -colors 5 +dither /tmp/vsb-vector/raster-5.png\nURL=$(vsb upload /tmp/vsb-vector/raster-5.png --json | jq -r '.url')\nvsb run vector/recraft-vectorize --image \"$URL\" --json\n```\n\n`magick` is ImageMagick. If it is missing, tighten the raster prompt\n(\"exactly N colours, no anti-aliasing, hard edges\") and rerun step 1.\n\n## Deliver\n\n- Output is `.svg`. Download template: `--download \"./out/{request_id}.svg\"`.\n- `--download` only if the user opted into local saves. Otherwise hand\n  back the share page `https://visualsandbox.com/share/<job_id>/`\n  (vsb critical rule 5).\n- The SVG has real paths. It opens in Illustrator, Figma, and Inkscape,\n  and it drops into Cricut, Glowforge, and LightBurn.\n- An animated SVG from route E is still one `.svg`. It loops in a\n  browser and in Figma, but a cutter reads only the shapes.\n\n## Cost estimation\n\n```bash\nvsb pricing vector/quiver-arrow-2 --json\nvsb pricing vector/quiver-arrow-2-telos --json\nvsb pricing vector/quiver-arrow-1.1 --json\nvsb pricing vector/recraft-vectorize --json\nvsb pricing image/nano-banana-2 --json\n```\n\nThe Arrow 2 family quotes a ceiling, not a fixed price. The bill lands at\nwhat the model actually drew, and never above the quote.\n\nRoute B is usually cheaper than route A for a detailed picture: one raster\nplus one trace costs less than one dense Quiver SVG. For a plain icon,\nroute A on Arrow 2 is the cheaper of the two.\n\n## Common gotchas\n\n- **Recraft's field is `image`, a single string.** Quiver's is `images`,\n  a list. Run `vsb schema vector/<slug> --json` before you guess.\n- **`svg` plus a prompt edits. `svg` alone animates.** Pass a prompt when\n  you meant to animate and you get an edit back. Force it with\n  `--operation animate`, `edit`, `generate` or `vectorize`.\n- **Only the Arrow 2 family has an `svg` field.** Arrow 1.1 and Recraft\n  cannot edit and cannot animate. Check the slug before you promise it.\n- **The slug has the category in it.** `vector/recraft-vectorize`, not\n  `image-enhance/recraft-vectorize`.\n- **Assume text comes out as paths, not `<text>`.** These models draw\n  letters as shapes. Open the file before you promise editable type.\n- **Gradients become colour bands.** Ask for solid fills in the raster\n  prompt, or accept the bands.\n- **Photos trace into thousands of paths.** Route C on a photo gives a\n  stylized trace, not a clean logo. Regenerate as a flat raster instead.\n"},"changes":[],"summary":"First saved snapshot. No earlier version is available for comparison.","summary_kind":"deterministic","summary_metadata":{}}