Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add mythkiven/figma-ios-codegen --skill figma-ios-snapkit-layoutgit clone --depth 1 https://github.com/mythkiven/figma-ios-codegenWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/mythkiven/figma-ios-codegen/figma-ios-snapkit-layout)<a href="https://agentmods.dev/skills/mythkiven/figma-ios-codegen/figma-ios-snapkit-layout"><img src="https://agentmods.dev/badge/skills/mythkiven/figma-ios-codegen/figma-ios-snapkit-layout/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/mythkiven/figma-ios-codegen/figma-ios-snapkit-layout"><img src="https://agentmods.dev/badge/skills/mythkiven/figma-ios-codegen/figma-ios-snapkit-layout.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00069 | $0.03777 |
| Opus 5 | $0.00034 | $0.01888 |
| Sonnet 5 | $0.00014 | $0.00755 |
| Haiku 4.5 | $0.00007 | $0.00378 |
Grade A, and why
figma-ios-snapkit-layout scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 9d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 327 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Figma → iOS:相对布局与 SnapKit
职责边界(与 figma-ios-hierarchy-preservation 的分工)
- 本 Skill 负责:约束写法(SnapKit 语法、相对 vs 绝对选择、offset 值如何从 Figma 数值得出、Safe Area 处理)。
- 不负责:层级映射(哪些 Figma 节点对应哪些 UIView、addSubview 顺序)→ 见 figma-ios-hierarchy-preservation。
- 不负责:颜色/字体 token → 见 figma-ios-design-token-mapping。
- 不负责:iOS 最低版本 API 限制 → 见 figma-ios-minimum-deployment-12。
- 不负责:节点跳过规则 → 见 figma-ios-to-code-conventions。
核心原则
- 尽量避免「纯绝对布局」:不要用 Figma 的
absoluteBoundingBox直接换算成view.frame = CGRect(...)/ 在layoutSubviews里手写整套 frame 作为唯一布局手段(除非用户明确要求或极少数动态几何场景)。 - 优先相对关系:视图相对 父视图(边距、对齐)、相对 兄弟视图(间距、基线、等高),保证旋转、Dynamic Type、不同屏宽时仍可维护。
- 约束用 SnapKit 表达:新建/维护 UIKit 布局时,默认使用 SnapKit(
import SnapKit),与项目内已有用法保持一致。 - 必须使用 Figma 节点的精确尺寸(重要):当 Figma 节点有明确的 width/height 时,代码中必须使用该精确值,而不是估算值或填满父容器。
Figma 数值怎么落到「相对」
| 稿里的含义 | 相对布局做法 |
|---|---|
| 相对画板/Frame 的 x、y、宽、高 | 转为对 superview 的 leading/trailing/top/bottom 或 width/height,必要时加 offset(对应稿中边距)。 |
| 两控件间距 | make.leading.equalTo(other.snp.trailing).offset(8) 一类,而不是两个绝对 frame 相减。 |
| 水平/垂直居中 | centerX / centerY / center 相对父或相对某兄弟。 |
| 贴安全区 | 对 safeAreaLayoutGuide.snp.* 或 view.safeAreaLayoutGuide 约束(SnapKit 项目常用 snp.safeArea 等,按宿主工程惯例)。 |
| 固定小图标尺寸 | 可用 固定宽高约束(仍是约束,不是运行时算 frame);资源本身尺寸与稿一致即可。 |
| Figma 节点有明确 width/height | 必须使用精确值:make.width.equalTo(298) / make.height.equalTo(100),禁止使用 equalToSuperview() 除非节点确实占满父容器。 |
| 子节点在稿里有明确 x(相对父 Frame) | 用 make.leading.equalToSuperview().offset(node.frame.relative.x)(或相对兄弟锚点),禁止用 make.centerX.equalToSuperview().multipliedBy(0.xx) 等魔法比例「估位置」。数据直接读 design.json[node].frame.relative.x,跳过包装层时改用 frame.absolute.x − 保留祖先.frame.absolute.x。 |
❌ 常见错误:不使用精确尺寸
问题:
// ❌ 错误:备注框占满整个宽度
remarkBackgroundView.snp.makeConstraints { make in
make.leading.trailing.equalToSuperview() // 宽度 = 父容器宽度(错误)
make.height.greaterThanOrEqualTo(100) // 高度估算(错误)
}
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 9d ago First seen · 327 lines · 69 tokens per session scan A c77fb60c4d6b
figma-ios-snapkit-layout is a skill published in the GitHub repository mythkiven/figma-ios-codegen (9 stars, last pushed 1mo ago), licensed MIT. It adds 69 tokens to every session and 3,777 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
figma-codegen
Generate framework-aware code from a Figma design. Reads the project's stack profile and emits code matching the existing framework (React/Vue/Svelte/Next/etc.) and styling (Tailwind/CSS/CSS-in-JS), reusing existing components and design tokens instead of regenerating from scratch. Triggers whenever the user wants a…
figma-build
Build a Figma design from code or a description — the reverse of figma-codegen. Reuses the connected file's existing design system (components, variables, styles) instead of drawing primitives with hardcoded values. Triggers whenever the user wants something created or updated IN Figma from code or a spec — e.g.…
app-icon-studio
Apple app icons: create, generate, evaluate, export, install, or debug iOS AppIcon.appiconset and macOS .icns assets for small-size clarity.
macos-window-architect
Use SwiftUI scene/window modifiers first; switch to macos-appkit-bridge only when SwiftUI cannot express the behavior.
ios-liquid-glass-designer
Implement, refactor, or review iOS 26+ SwiftUI Liquid Glass with native glassEffect, GlassEffectContainer, button styles, availability gates, and non-glass fallbacks.
unship
Compare agent-made alternatives in a local browser preview with Unship. Use for comparison setup, iteration, Canvas, selection, cleanup, and Unship installation or update troubleshooting.