anim-backoutdown
Back Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
Source facts
- Repository
- nexu-io/motion-anything
- Last source activity
- July 6, 2026 at 14:56
- Detected SKILL.md language
- English
- Stars
- 846
- Forks
- 102
Install options
The review-first prompt is selected by default. You can switch to a direct command or download a local copy.
Review the source files
Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.
File Explorer
4 filesShowing SKILL.md
SKILL.md
Source instructions · Read-only preview- name
- anim-backoutdown
- description
- Back Out Down — a drop-in CSS keyframe animation from Animate.css (Hippocratic-2.1, © Daniel Eden). No JS required. Honors prefers-reduced-motion. Use restrained; attribute Animate.css.
- triggers
- ["backoutdown","css animation","退出动效"]
- od
- {"mode":"prototype","surface":"web","platform":"desktop","category":"animation-motion","upstream":"https://github.com/animate-css/animate.css","preview":{"type":"html"},"design_system":{"requires":false},"example_prompt":"Apply backOutDown (Animate.css) to the element as a exit animation, restrained, with a\nprefers-reduced-motion fallback. Attribute Animate.css.\n"}
# Animate · Back Out Down
Back Out Down — CSS keyframe animation from [Animate.css](https://github.com/animate-css/animate.css)
(Hippocratic License 2.1, © Daniel Eden). Part of [motion-anything](https://github.com/nexu-io/motion-anything).
## When to use it
- A quick, drop-in CSS exit animation (no JS).
## When NOT to use it (restraint)
- Many at once / must-read content. Keep it restrained.
## How to apply
1. Copy `backOutDown.css`. 2. Add class `backOutDown` to the element + set `animation-duration`.
## Accessibility & license
- `prefers-reduced-motion`: disabled. Attribute Animate.css (Hippocratic-2.1).
View on GitHub