How do I install the Sf Symbols skill?

Run npx skillmds@latest add caglarbaranbora/sf-symbols in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Sf Symbols safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Sf Symbols?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Sf Symbols free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Sf Symbols?

caglarbaranbora (@caglarbaranbora) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Sf Symbols by caglarbaranbora — Agent Skill

Name: Sf Symbols
Author: caglarbaranbora

Sf Symbols

Route SF Symbols API implementation tasks to the correct Knowledge Contracts — symbol basics (Image(systemName:)/UIImage(systemName:)), rendering modes, symbol variants, variable value symbols, weight/scale, color/tinting mechanics, custom symbol usage, and UIKit SymbolConfiguration composition. Use when writing or reviewing code that renders, styles, or configures an SF Symbol in SwiftUI or UIKit. v1 excludes symbol effects/animations (SymbolEffect) and Symbol Composer/custom symbol authoring. Design-level symbol selection (which symbol, which color, as a design decision) is out of scope here — see the human-interface-guidelines skill. Triggers on SF Symbols, Image(systemName:), UIImage(systemName:), symbolRenderingMode, SymbolVariants, variableValue, imageScale, fontWeight on a symbol, SymbolConfiguration, preferredSymbolConfiguration, withConfiguration, hierarchical rendering, palette rendering, multicolor rendering.

File contents

SF Symbols — Foundations Skill

Purpose

Route SF Symbols API implementation tasks to the minimum required SF Symbols Knowledge Contracts. v1 scope is core rendering, rendering modes, variants, variable value, weight/scale, color/tinting, custom symbol usage, and UIKit SymbolConfiguration composition — across SwiftUI and UIKit.

Routing

Load only the contracts relevant to the task. All paths relative to knowledge/sf-symbols/.

Usage -> symbol-basics.md, custom-symbol-usage.md
Rendering -> rendering-modes.md, symbol-variants.md, variable-value-symbols.md, symbol-weight-and-scale.md, symbol-color-and-tinting.md
UIKit-specific -> uikit-symbol-configuration.md

Never load more than the contracts relevant to the specific question. For which symbol to choose, which color fits a design, or fill vs. outline as a design decision, route to skill.human-interface-guidelines.foundations instead. For view composition/state/navigation questions unrelated to symbol rendering itself, route to skill.swiftui.foundations or skill.uikit.foundations.

Stop Conditions

Stop and report if the requested topic has no matching Knowledge Contract in knowledge/sf-symbols/ — do not guess or fall back to general knowledge.

Symbol effects/animations (SymbolEffect, .bounce, .pulse, .variableColor) — Excluded
Symbol Composer / custom symbol authoring — Excluded

---name: sf-symbolsdescription: Route SF Symbols API implementation tasks to the correct Knowledge Contracts — symbol basics (Image(systemName:)/UIImage(systemName:)), rendering modes, symbol variants, variable value symbols, weight/scale, color/tinting mechanics, custom symbol usage, and UIKit SymbolConfiguration composition. Use when writing or reviewing code that renders, styles, or configures an SF Symbol in SwiftUI or UIKit. v1 excludes symbol effects/animations (SymbolEffect) and Symbol Composer/custom symbol authoring. Design-level symbol selection (which symbol, which color, as a design decision) is out of scope here — see the human-interface-guidelines skill. Triggers on SF Symbols, Image(systemName:), UIImage(systemName:), symbolRenderingMode, SymbolVariants, variableValue, imageScale, fontWeight on a symbol, SymbolConfiguration, preferredSymbolConfiguration, withConfiguration, hierarchical rendering, palette rendering, multicolor rendering.---# SF Symbols — Foundations Skill## PurposeRoute SF Symbols API implementation tasks to the minimum required SFSymbols Knowledge Contracts. v1 scope is core rendering, renderingmodes, variants, variable value, weight/scale, color/tinting, customsymbol usage, and UIKit `SymbolConfiguration` composition — acrossSwiftUI and UIKit.## RoutingLoad only the contracts relevant to the task. All paths relative toknowledge/sf-symbols/.- Usage -> symbol-basics.md, custom-symbol-usage.md- Rendering -> rendering-modes.md, symbol-variants.md, variable-value-symbols.md, symbol-weight-and-scale.md, symbol-color-and-tinting.md- UIKit-specific -> uikit-symbol-configuration.mdNever load more than the contracts relevant to the specific question.For which symbol to choose, which color fits a design, or fill vs.outline as a design decision, route to`skill.human-interface-guidelines.foundations` instead. For viewcomposition/state/navigation questions unrelated to symbol renderingitself, route to `skill.swiftui.foundations` or `skill.uikit.foundations`.## Stop ConditionsStop and report if the requested topic has no matching KnowledgeContract in knowledge/sf-symbols/ — do not guess or fall back to generalknowledge.- Symbol effects/animations (`SymbolEffect`, `.bounce`, `.pulse`, `.variableColor`) — Excluded- Symbol Composer / custom symbol authoring — Excluded

Frequently asked questions