smithery.ai

audit-easings

Scan the entire project for animations using default or missing easings and produce a prioritized improvement report. Use when asking "audit my CSS animations", "scan the project for bad transitions", or "give me a report on all my easings".

First seen Mar 31, 2026

Installation

$ npx skills add https://smithery.ai

Also in this package

Other skills from smithery.ai · top by installs.

npx skills add https://smithery.ai

Browse all from smithery.ai

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Skill metadata

Parsed from SKILL.md frontmatter.

Allowed toolsmcp__easingwizard__get_presets, mcp__easingwizard__create_bezier_curve, mcp__easingwizard__create_spring_curve, mcp__easingwizard__create_bounce_curve, mcp__easingwizard__create_wiggle_curve, mcp__easingwizard__create_overshoot_curve

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,742 B
  • docs SUMMARY.md 91 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 1 installs

SKILL.md

Easing Audit

The user wants a comprehensive review of their project's animation easings.

Step 1: Scan the Project

Search for animation and transition properties across the codebase:

  1. Search for CSS files (.css, .scss, .sass, .less) containing transition or animation properties
  2. Search for component files (.jsx, .tsx, .vue, .svelte) containing Tailwind easing classes (ease-, transition-) or inline style animation properties
  3. Search for CSS-in-JS patterns (style=, css=, styled.) with transition/animation values

Step 2: Categorize Findings

For each animation/transition found, categorize:

  • Defaults — Using ease, linear, ease-in, ease-out, ease-in-out (browser defaults, likely unintentional)
  • Custom — Using cubic-bezier(...), linear(...), or Tailwind ease-[...] (intentional choices)
  • Missing — Animations/transitions with no easing specified (falls back to browser default ease)

Step 3: Generate Suggestions

For each default or missing easing, suggest a specific Easing Wizard curve replacement. Base suggestions on:

  • The CSS property being animated (opacity → subtle, transform → responsive, etc.)
  • The surrounding code context (hover → quick ease-out, modal → spring, etc.)
  • Motion design best practices

Use get_presets with verbose: true to get share URLs for each suggested preset.

Only use curve creation tools if no preset is a good match.

Step 4: Output the Report

Present findings as a structured markdown report:

## Easing Audit Report

### Summary
- **X** animations/transitions found
- **Y** using browser defaults
- **Z** with no easing specified
- **W** using custom easings

### Findings

| File | Line | Property | Current | Suggested | Reasoning | Preview |
|------|------|----------|---------|-----------|-----------|---------|
| src/App.css | 12 | transition | ease | Spring SNAP | Hover state benefits from responsive spring feel | [Preview](url) |
| ... | ... | ... | ... | ... | ... | ... |

### Recommendations
[Prioritized list of highest-impact improvements, starting with the most visible/frequently triggered animations]