Files
everything-claude-code/skills/remotion/rules/animations.md
Affaan Mustafa 4813ed753f feat: consolidate all Anthropic plugins into ECC v2.0.0
Ports functionality from 10+ separate plugins into ECC so users only
need one plugin installed. Consolidates: pr-review-toolkit, feature-dev,
commit-commands, hookify, code-simplifier, security-guidance,
frontend-design, explanatory-output-style, and personal skills.

New agents (8): code-architect, code-explorer, code-simplifier,
comment-analyzer, conversation-analyzer, pr-test-analyzer,
silent-failure-hunter, type-design-analyzer

New commands (9): commit, commit-push-pr, clean-gone, review-pr,
feature-dev, hookify, hookify-list, hookify-configure, hookify-help

New skills (8): frontend-design, hookify-rules, github-ops,
knowledge-ops, lead-intelligence, oura-health, pmx-guidelines, remotion

Enhanced skills (8): article-writing, content-engine, market-research,
investor-materials, investor-outreach, x-api, security-scan,
autonomous-loops — merged with personal skill content

New hook: security-reminder.py (pattern-based OWASP vulnerability
warnings on file edits)

Totals: 36 agents, 69 commands, 128 skills, 29 hook scripts
2026-03-31 21:55:43 -07:00

30 lines
789 B
Markdown

---
name: animations
description: Fundamental animation skills for Remotion
metadata:
tags: animations, transitions, frames, useCurrentFrame
---
All animations MUST be driven by the `useCurrentFrame()` hook.
Write animations in seconds and multiply them by the `fps` value from `useVideoConfig()`.
```tsx
import { useCurrentFrame } from "remotion";
export const FadeIn = () => {
const frame = useCurrentFrame();
const { fps } = useVideoConfig();
const opacity = interpolate(frame, [0, 2 * fps], [0, 1], {
extrapolateRight: 'clamp',
});
return (
<div style={{ opacity }}>Hello World!</div>
);
};
```
CSS transitions or animations are FORBIDDEN - they will not render correctly.
Tailwind animation class names are FORBIDDEN - they will not render correctly.