m-animate
Add purposeful motion. Page load reveals, hover states, scroll entries.
- License 许可
- Apache-2.0
- 最近更新
- 2026-03-21
- Stars
- ★ 1
- Forks
- 0
01 前言 Front Matter
- name
- m-animate
- description
- Add purposeful motion. Page load reveals, hover states, scroll entries.
- user-invokable
- true
03 SKILL.md 正文
/m-animate — Add Motion
Page load: staggered fade-up, 80-120ms delays, complete within 600ms\nHover: scale 1.02-1.05, shadow lift, color transition, 200-300ms\nScroll: fade-in + translate 20-30px via IntersectionObserver\nTransitions: all interactive states get transition declarations\n\nAlways include prefers-reduced-motion: reduce fallback.
04 同仓库更多 Skills
meridian-design
Design DNA engine that learns your codebase before making recommendations. Maps 8 design axes (typography, color, layout, motion, accessibility, tokens, hierarchy, personality), builds a project-aware profile in .meridian.json, and enforces your established aesthetic. 62 commands across 5 tiers. Every command respects what you've already built. Use on any frontend project to prevent AI slop while preserving design intent.
m-z-index
暂无简介
m-type-set
Apply a complete typography system in one command. Scale, pairing, line-heights, letter-spacing.
m-type-scale
Generate a mathematical type scale from a base size and ratio. Outputs 8 steps with px values, rem equivalents, and CSS custom properties.
m-type-pair
Font pairing recommendations. Display + body + mono. Never suggests banned fonts.
m-type-fix
Auto-fix typography issues. Replace banned fonts, normalize scale, add line-height.