Install dotLottie implementation guidelines as a skill/command for your AI coding assistant.
curl -fsSL https://raw.githubusercontent.com/LottieFiles/dotlottie-web/main/guidelines/install.sh | bash| Tool | Location | Usage |
|---|---|---|
| Claude Code | ~/.claude/commands/ |
/dotlottie or ask naturally |
| Cursor | ~/.cursor/commands/ |
@dotlottie-guidelines |
| OpenCode | ~/.config/opencode/command/ |
Reference in prompts |
| Windsurf | ~/.codeium/windsurf/memories/ |
Automatic context |
| Gemini CLI | ~/.gemini/commands/ |
/dotlottie-guidelines |
| Codex CLI | ~/.codex/commands/ |
Reference in prompts |
If you prefer manual installation or want to add to a project:
# Download to current directory
curl -sL https://raw.githubusercontent.com/LottieFiles/dotlottie-web/main/guidelines/command.md > DOTLOTTIE.md
# Or add to your project's AGENTS.md / CLAUDE.mdThe guidelines cover:
- Package Selection - When to use
dotlottie-webvsdotlottie-react - Basic Implementation - Setup for vanilla JS and React
- State Machines - Interactive animations without code
- Theming - Runtime customization with themes
- Dynamic Slot Overriding - Type-safe APIs for colors, text, vectors, gradients, and scalars
- Markers & Segments - Playing specific parts of animations
- Performance - Lazy loading, freezing, cleanup
- Common Patterns - Hover, click, scroll interactions
- Debugging - Inspecting animation state
Found an issue or want to improve the guidelines? PRs welcome!