remotion-best-practices

```

.

├── .claude-plugin/ # Claude plugin configuration files

├── skills/ # Antigravity Skills library

│ ├── skill-name/ # Individual skill directory

│ │ ├── SKILL.md # Core skill definition and Prompt (Required)

│ │ ├── scripts/ # Scripts relied upon by the skill (Optional)

│ │ ├── examples/ # Skill usage examples (Optional)

│ │ └── resources/ # Templates and resources relied upon by the skill (Optional)

├── docs/ # User manual and documentation guides

├── scripts/ # Maintenance scripts

├── skills_sources.json # Skills synchronization source config

├── skills_index.json # Skills metadata index

├── spec/ # Specification documents

├── template/ # New skill template

└── README.md

```

Antigravity Skills follow the universal SKILL.md format and can work seamlessly with any AI coding assistant that supports Agentic Skills:

| Tool Name (Agent) | Type | Compatibility | Project Path | Global Path |

| :--- | :--- | :--- | :--- | :--- |

| Antigravity | IDE | ✅ Full | .agent/skills/ | ~/.gemini/antigravity/skills/ |

| Claude Code | CLI | ✅ Full | .claude/skills/ | ~/.claude/skills/ |

| Gemini CLI | CLI | ✅ Full | .gemini/skills/ | ~/.gemini/skills/ |

| Codex | CLI | ✅ Full | .codex/skills/ | ~/.codex/skills/ |

| Cursor | IDE | ✅ Full | .cursor/skills/ | ~/.cursor/skills/ |

| GitHub Copilot | Extension| ⚠️ Partial | .github/skills/ | ~/.copilot/skills/ |

| OpenCode | CLI | ✅ Full | .opencode/skills/ | ~/.config/opencode/skills/ |

| Windsurf | IDE | ✅ Full | .windsurf/skills/ | ~/.codeium/windsurf/skills/ |

| Trae | IDE | ✅ Full | .trae/skills/ | ~/.trae/skills/ |

> [!TIP]

> Most tools will automatically discover skills in .agent/skills/. For maximum compatibility, please clone/copy into this directory.

1. Prepare the Skills Library

First, clone this repository locally (it is recommended to place it in a fixed location for global reference):

```bash

git clone https://github.com/guanyang/antigravity-skills.git ~/antigravity-skills

```

2. Install Skills (Symlink Method)

We strongly recommend using Symbolic Links (Symlink) for installation, so that when you update this repository via git pull, all tools will automatically sync the latest features.

#### 🔹 Method A: Project Level Installation

Enable skills only for the current project. Run in your project root:

```bash

mkdir -p .agent/skills

ln -s ~/antigravity-skills/skills/* .agent/skills/

```

#### 🔹 Method B: Global Level Installation

Enable skills by default in all projects. Run the corresponding command based on the tool; common examples:

| Tool Name | Global Installation Command (macOS/Linux) |

| :--- | :--- |

| General | mkdir -p ~/.agent/skills && ln -s ~/antigravity-skills/skills/* ~/.agent/skills/ |

| Claude Code | mkdir -p ~/.claude/skills && ln -s ~/antigravity-skills/skills/* ~/.claude/skills/ |

| Antigravity | mkdir -p ~/.gemini/antigravity/skills && ln -s ~/antigravity-skills/skills/* ~/.gemini/antigravity/skills/ |

| Gemini | mkdir -p ~/.gemini/skills && ln -s ~/antigravity-skills/skills/* ~/.gemini/skills/ |

| Codex | mkdir -p ~/.codex/skills && ln -s ~/antigravity-skills/skills/* ~/.codex/skills/ |

#### 🔹 Method C: Claude Plugin Installation (Claude Code Only)

If you primarily use Claude Code, you can install with one click via the plugin marketplace (this method automatically handles skill loading):

```bash

# 1. Start Claude Code

# 2. Add the plugin marketplace

/plugin marketplace add guanyang/antigravity-skills

# 3. Install the plugin from the marketplace

/plugin install antigravity-skills@antigravity-skills

```

3. Using Skills

Enter @[skill-name] or /skill-name in the chat box to invoke them, for example:

```text

/canvas-design Help me design a 16:9 blog cover about "Deep Learning"

```

4. More Information

• View Manual: For detailed usage, please refer to [docs/Antigravity_Skills_Manual.en.md](docs/Antigravity_Skills_Manual.en.md).
• Environment Dependencies: Some skills rely on Python environments; please ensure your system has necessary libraries installed (e.g., pdf2docx, pandas, etc.).

Many skills in this project originate from excellent open-source communities. To keep in sync with upstream repositories, you can update them in the following ways:

1. Configuration: The skills_sources.json file in the root directory is pre-configured with the upstream repositories for major skills and usually does not need manual adjustment.
2. Run Sync:

You can choose to sync all skills or just a specific one:

```bash

# Sync all configured sources

./scripts/sync_skills.sh

# Sync only a specific source (e.g., anthropics-skills)

./scripts/sync_skills.sh anthropics-skills

```

The script will automatically pull the latest code and update the corresponding skill directories.

> Note: The ui-ux-pro-max skill has a special directory structure and does not support automatic synchronization via script for now. Please use its official installation command uipro init --ai antigravity to install or update.

🎨 Creative & Design

These skills focus on visual expression, UI/UX design, and artistic creation.

• @[algorithmic-art]: Create algorithmic and generative art using p5.js code.
• @[canvas-design]: Create posters and artworks (PNG/PDF output) based on design philosophies.
• @[json-canvas]: Create and edit JSON Canvas files (.canvas) with nodes, edges, and groups (commonly used in Obsidian).
• @[frontend-design]: Create high-quality, production-grade frontend interfaces and Web components.
• @[ui-ux-pro-max]: Professional UI/UX design intelligence, providing full design schemes for colors, fonts, layouts, etc.
• @[web-artifacts-builder]: Build complex, modern Web apps (based on React, Tailwind, Shadcn/ui).
• @[theme-factory]: Generate matching themes for documents, slides, HTML, etc.
• @[brand-guidelines]: Apply Anthropic's official brand design specifications (colors, typography, etc.).
• @[remotion]: Best practices for Remotion - Video creation in React.
• @[slack-gif-creator]: Create high-quality animated GIFs optimized specifically for Slack.

🛠️ Development & Engineering

These skills cover the full lifecycle of coding, testing, debugging, and code review.

• @[test-driven-development]: Test-Driven Development (TDD) - write tests before implementation code.
• @[systematic-debugging]: Systematic debugging for resolving bugs, test failures, or abnormal behaviors.
• @[webapp-testing]: Use Playwright for interactive testing and verification of local web applications.
• @[receiving-code-review]: Handle code review feedback using technical verification rather than blind modification.
• @[requesting-code-review]: Proactively initiate code reviews to verify code quality before merging or completion.
• @[finishing-a-development-branch]: Guide the finalization of a development branch (merges, PRs, cleanups, etc.).
• @[subagent-driven-development]: Coordinate multiple sub-agents to perform independent development tasks in parallel.

📄 Documentation & Office

These skills are used for handling professional documents and office needs in various formats.

• @[doc-coauthoring]: Guide users through collaborative writing of structured do