New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

SVG

by gridaco in gridaco/grida

Author and edit .svg files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery.

Apache-2.0Auto-check passed

Install SVG

skills CLI
$ npx skills add gridaco/grida --skill svg -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install gridaco/grida svg --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/gridaco/grida.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/svg .claude/skills/svg && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
svg
GitHub stars
2.7k
Token cost
~615 tokens
SKILL.md length
327 words
Files
1
Skills in repo
29
Repo updated
First seen
Licence
Apache-2.0

At a glance

Author and edit .svg files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery.

  • Modifying an SVG document
  • SKILL.md covers Show the result and SVG style
  • Reaches w3.org

What it does

SVG is an agent skill from gridaco/grida. Author and edit .svg files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery. Use when creating or modifying an SVG document.

Its SKILL.md is about 620 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

The licence is Apache-2.0.

When your agent uses it

  • Modifying an SVG document

Example prompts

  • “/svg”

What it can do on your machine

Read from SKILL.md and the folder at commit 165496f. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • w3.org

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

SVG loads about 615 tokens when it runs. Until then it costs about 43 tokens; SKILL.md has 327 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~43
When it runs · the whole SKILL.md, loaded when a task matches
~615

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from gridaco/grida at commit 165496f, republished under its Apache-2.0 licence (© gridaco). 327 words, ~615 tokens.

Download SKILL.mdSave it as .claude/skills/svg/SKILL.md (or your agent's skills folder).
name
svg
description
Author and edit `.svg` files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery. Use when creating or modifying an SVG document.

When you operate on .svg files inside a Grida editor session:

  • Writes are reflected on the canvas instantly if the human is currently viewing that document. Treat the canvas as a live render of what you wrote.
  • You may create and edit non-SVG files (e.g. /notes/draft.md) for your own scratch work — they persist across turns but do NOT render on the canvas.
  • On edit_file reason="parse_error", your output broke the SVG. Re-read and fix.

Show the result

  • Treat presentation as the first production milestone, not the final "validate and open" step. For a new standalone SVG, write a meaningful valid first frame with the intended dimensions and basic visible composition, call surface_open immediately with its workspace-rooted path (for example, /poster.svg), then continue adding and refining details while the user can watch. Do not wait for complete content, polish, preview generation, exhaustive validation, or task completion. For nontrivial work, intentionally start with the basic frame instead of authoring the finished SVG before opening it.
  • Never open an empty or invalid SVG. For an existing primary SVG, open it before substantial edits.
  • Open a standalone SVG by its file path. When the SVG belongs to a .canvas board or deck, the board/deck skill owns presentation: open the .canvas bundle directory once its manifest references a valid document, never the internal SVG or .canvas.json manifest.
  • If the standalone SVG or .canvas bundle is already mounted at the dedicated file surface's root, it is already presented; do not call surface_open just to reopen it.
  • Treat presentation as auxiliary: continue regardless of the result, never retry based on presentation status, and do not call surface_open after every write.
  • Use surface_list_open only when the current host surface state is materially useful. It is not required before surface_open.

SVG style

When you produce SVG:

  • Keep xmlns="http://www.w3.org/2000/svg" on the root element.
  • Preserve existing viewBox, width, height unless asked.
  • Preserve unrelated nodes and attributes (ids, classes, transforms).
  • Match the existing formatting (one element per line, 2-space indent).

© gridaco, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/svg of gridaco/grida.

Open the folder on GitHubat commit 165496f

Compare with similar skills

SVG next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

SVG compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
SVG this skillgridaco/grida2.7k—~615Automated safety check: PassApache-2.0
Hermes Agent Skill AuthoringNousResearch/hermes-agent252k—~3.6kAutomated safety check: PassMIT
Configuring Oauth2 Authorization Flowmukul975/Anthropic-Cybersecurity-Skills34k—~1.7kAutomated safety check: PassApache-2.0
Authoring Skillsvercel/next.js143k—~1kAutomated safety check: PassMIT
Abp Authorizationabpframework/abp14k—~1.3kAutomated safety check: PassLGPL-3.0
Implementing GCP Binary Authorizationmukul975/Anthropic-Cybersecurity-Skills34k—~2kAutomated safety check: PassApache-2.0

Similar skills

  • Hermes Agent Skill Authoring

    NousResearch/hermes-agent

    Author in-repo SKILL.md files: frontmatter and structure. An agent skill from NousResearch/hermes-agent.

    252k GitHub stars~3.6k tokensUpdated today
    Agent WorkflowsAuto-check passed

  • Configuring Oauth2 Authorization Flow

    mukul975/Anthropic-Cybersecurity-Skills

    Configures secure OAuth 2.0 authorization flows, including Authorization Code with PKCE, Client Credentials, and Device Authorization Grant, covering flow selection, PKCE implementation, token…

    34k GitHub stars~1.7k tokensUpdated 1 mo ago
    Backend & APIsAuto-check passed

  • Authoring Skills

    vercel/next.js

    Official

    How to create and maintain agent skills in .agents/skills/. An agent skill from vercel/next.js.

    143k GitHub stars~1k tokensUpdated today
    Agent WorkflowsAuto-check passed

  • Abp Authorization

    abpframework/abp

    ABP permission system - PermissionDefinitionProvider, [Authorize] attribute, CheckPolicyAsync, IsGrantedAsync, ICurrentUser, IPermissionManager, multi-tenancy side.

    14k GitHub stars~1.3k tokensUpdated today
    Backend & APIsAuto-check passed

  • Implementing GCP Binary Authorization

    mukul975/Anthropic-Cybersecurity-Skills

    Implements GCP Binary Authorization end to end, including creating KMS-backed attestors, Container Analysis notes, deploy-time policies, and signing image attestations, so that only trusted…

    34k GitHub stars~2k tokensUpdated 1 mo ago
    DevOps & CloudAuto-check passed

  • Collectors Authoring

    netdata/netdata

    Author, modify, or review Netdata collectors across Go, IBM, C, Rust and external plugins.

    81k GitHub stars~1.9k tokensUpdated yesterday
    DevOps & CloudAuto-check passed

More from gridaco/grida

All 29 skills in this repo

  • Desktop

    gridaco/grida

    Grida Desktop Electron shell and release-impact work: BrowserWindow, preload, window.grida, menus, protocol/deep links, file associations, Forge, path-scoped bridge security, Electron-only UI bugs…

    2.7k GitHub stars~3.2k tokensUpdated yesterday
    Auto-check: notes

  • Io Figma

    gridaco/grida

    Guides work on the Figma I/O package (@grida/io-figma, packages/grida-canvas-io-figma/).

    2.7k GitHub stars~2.2k tokensUpdated yesterday
    Auto-check: notes

  • Opt Library

    gridaco/grida

    Set up, download, verify, and seed the optional Grida Library developer corpus into local Supabase.

    2.7k GitHub stars~1.4k tokensUpdated yesterday
    Auto-check passed

  • Vision

    gridaco/grida

    Query images with a local Ollama vision model without loading the image into the main agent context.

    2.7k GitHub stars~1.5k tokensUpdated yesterday
    Auto-check passed

  • AI Models

    gridaco/grida

    Research, compare, and update shared AI model JSON for TypeScript, web, and Rust consumers.

    2.7k GitHub stars~5.7k tokensUpdated yesterday
    Auto-check passed

  • Agent System

    gridaco/grida

    Grida AI agent system work: @grida/daemon (DaemonServer, loopback HTTP perimeter, files/workspaces, secrets store, daemon discovery) and @grida/agent (the agent tenant: sessions, providers/BYOK…

    2.7k GitHub stars~3.4k tokensUpdated yesterday
    Auto-check passed

Questions about SVG

What does SVG do?

Author and edit .svg files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery. SVG is an agent skill from gridaco/grida.svg files in a Grida editor session — live-canvas binding, SVG output style, and parse-error recovery.

When should I use SVG?

SVG fits situations like: modifying an SVG document.

How do I install SVG in Claude Code?

Run `npx skills add gridaco/grida --skill svg -a claude-code`. Or copy the skill folder (skills/svg in gridaco/grida) into .claude/skills/svg in your project. Claude Code loads it when a task matches its description.

How do I install SVG in Codex?

Run `npx skills add gridaco/grida --skill svg -a codex`. Or copy the skill folder (skills/svg in gridaco/grida) into .agents/skills/svg in your project. Codex loads it when a task matches its description.

Can I use SVG in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add gridaco/grida --skill svg -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/svg, .gemini/skills/svg, .github/skills/svg and .opencode/skills/svg in your project.

What does SVG need to run?

SKILL.md names no scripts, command-line tools or credentials: SVG is instructions for the agent only.

Does SVG access the network?

SKILL.md names 1 domain. In commands or code: w3.org; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is SVG safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does SVG use?

SVG is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does SVG use?

About 615 tokens (SKILL.md is roughly 2.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to SVG?

Skills that share tags, products or a category with SVG: Hermes Agent Skill Authoring (NousResearch/hermes-agent, 252k stars), Configuring Oauth2 Authorization Flow (mukul975/Anthropic-Cybersecurity-Skills, 34k stars), Authoring Skills (vercel/next.js, 143k stars) and Abp Authorization (abpframework/abp, 14k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains SVG?

gridaco (a GitHub organization) maintains it in gridaco/grida, which has 2,659 GitHub stars. The repository holds 29 skills in this directory. The repository was last updated on October 7, 2026.

Source: gridaco/grida on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.