A specialized tool for converting SVG icons into native Xcode SF Symbol asset catalogs with proper template injection.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install sfsymbol-generator
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install sfsymbol-generator using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is SF Symbol Generator?
The SF Symbol Generator is designed to bridge the gap between vector design and native Apple development. It automates the tedious process of creating .symbolset folders, which are required for custom iconography in Xcode. By leveraging Openclaw Skills, developers can programmatically transform standard SVG files into symbols that support Apple's native scaling and weight system.
This skill handles the heavy lifting of calculating path bounds, centering graphics within the SF Symbols template margins, and generating the necessary Contents.json metadata. Whether you are building for iOS, macOS, or watchOS, this tool ensures your custom icons are structured correctly for the asset catalog, significantly reducing manual configuration errors.
SF Symbol Generator Use Cases
- Converting brand logos into native Xcode SF Symbols for consistent UI implementation.
- Automating iconography pipelines to update asset catalogs directly from design exports.
- Creating multi-weight symbols by injecting custom SVG paths into standard templates.
- Batch processing SVG assets into valid .symbolset structures for large-scale Apple platform projects.
How SF Symbol Generator Works
- The skill validates the source SVG path and ensures a valid viewBox is present for coordinate calculations.
- It computes the geometry of the paths to ensure they are properly centered and scaled within the standard SF Symbols template.
- The tool injects the path data into a template SVG, supporting Ultralight, Regular, and Black weights.
- A new .symbolset directory is created within the specified Xcode Assets catalog.
- The skill writes the required Contents.json file and the final SVG asset to complete the bundle.
SF Symbol Generator Setup
Define your asset catalog directory (optional, defaults to Assets.xcassets/Symbols):
export SFSYMBOL_ASSETS_DIR="./MyProject/Assets.xcassets/Symbols"
Run the generator using the recommended template-based approach:
./scripts/generate-from-template.js <symbol-name> <svg-path>
For raw generation without template injection:
./scripts/generate.sh <symbol-name> <svg-path> [assets-dir]
SF Symbol Generator Data Schema & Taxonomy
The skill produces a standard Apple-compliant directory structure within your asset catalog:
| File/Folder | Purpose |
|---|---|
<symbol-name>.symbolset/ |
The container folder recognized by Xcode. |
Contents.json |
Metadata specifying the format version and authoring tool. |
<name>.svg |
The processed SVG containing the injected symbol paths. |
SF Symbol Generator Advanced Features
- Environment variable support via SFSYMBOL_ASSETS_DIR for flexible CI/CD integration.
- Automatic conversion of basic rectangle shapes into path-based data for better compatibility.
- Custom template support allows developers to provide their own base SF Symbol templates.
- Support for dot-notation symbol naming (e.g., brand.logo.fill) to maintain organized asset hierarchies.
SKILL.md
Loading
Related Openclaw Skills
Soulseek P2P Communication & File Sharing
Soulseek provides a decentralized peer-to-peer network for AI agents to communicate and exchange files without custom infrastructure.
Agent Security Monitor
A proactive security auditing and alerting tool designed to shield AI agent environments from credential leaks, malicious commands, and supply chain vulnerabilities.
Bot Status API
A lightweight, zero-dependency Node.js API to monitor Openclaw Skills health, system metrics, and agent connectivity.
Cron Doctor
A comprehensive diagnostic tool for identifying, triaging, and fixing cron job failures across Linux and macOS environments.
Car & Insurance Management Skill
A comprehensive AI agent skill for calculating car taxes, checking used car prices, and managing insurance claims through automated intent routing.
HIRA Hospital Info Skill
A professional-grade medical directory skill that connects AI agents to South Korea's official HIRA database for real-time hospital and clinic information.
Featured*
