{"id":"598c3341-4df0-49ab-b304-928b2ab173ad","slug":"umbrellamode-animejs-best-practices","name":"anime.js Best Practices","description":"This skill should be used when the user asks to \"animate elements\", \"add animations\", \"create transitions\", \"use anime.js\", \"implement motion\", \"add scroll animations\", \"create timeline animations\", \"stagger animations\", \"animate SVG\", \"add draggable elements\", or needs guidance on anime.js v4 patterns, easing, performance, or React/Next.js animation integration.","canonicalUrl":"https://www.xpersona.co/skill/umbrellamode-animejs-best-practices","sourceUrl":"https://github.com/umbrellamode/animejs-best-practices","homepage":null,"source":"GITHUB_OPENCLEW","vendor":{"slug":"umbrellamode","label":"Umbrellamode","url":"https://github.com/umbrellamode/animejs-best-practices"},"protocols":["OPENCLEW"],"capabilities":[],"trustScore":null,"trustConfidence":"unknown","artifactCount":0,"benchmarkCount":0,"lastRelease":null,"freshnessAt":"2026-03-01T06:05:23.281Z","freshnessLabel":"Mar 1, 2026","securityReviewed":true,"openapiReady":true,"stats":[{"label":"Trust score","value":"Unknown"},{"label":"Compatibility","value":"OpenClaw"},{"label":"Freshness","value":"Mar 1, 2026"},{"label":"Vendor","value":"Umbrellamode"},{"label":"Artifacts","value":"0"},{"label":"Benchmarks","value":"0"},{"label":"Last release","value":"Unpublished"}],"factsPreview":[{"factKey":"docs_crawl","category":"integration","label":"Crawlable docs","value":"6 indexed pages on the official domain","href":"https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar","sourceUrl":"https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar","sourceType":"search_document","confidence":"medium","observedAt":"2026-04-15T05:03:46.393Z","isPublic":true},{"factKey":"vendor","category":"vendor","label":"Vendor","value":"Umbrellamode","href":"https://github.com/umbrellamode/animejs-best-practices","sourceUrl":"https://github.com/umbrellamode/animejs-best-practices","sourceType":"profile","confidence":"medium","observedAt":"2026-03-01T06:05:23.281Z","isPublic":true},{"factKey":"protocols","category":"compatibility","label":"Protocol compatibility","value":"OpenClaw","href":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/contract","sourceUrl":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/contract","sourceType":"contract","confidence":"medium","observedAt":"2026-02-24T19:45:34.139Z","isPublic":true},{"factKey":"auth_modes","category":"compatibility","label":"Auth modes","value":"api_key","href":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/contract","sourceUrl":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/contract","sourceType":"contract","confidence":"high","observedAt":"2026-02-24T19:45:34.139Z","isPublic":true},{"factKey":"schema_refs","category":"artifact","label":"Machine-readable schemas","value":"OpenAPI or schema references published","href":"https://github.com/umbrellamode/animejs-best-practices#input","sourceUrl":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/contract","sourceType":"contract","confidence":"high","observedAt":"2026-02-24T19:45:34.139Z","isPublic":true},{"factKey":"handshake_status","category":"security","label":"Handshake status","value":"UNKNOWN","href":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/trust","sourceUrl":"https://www.xpersona.co/api/v1/agents/umbrellamode-animejs-best-practices/trust","sourceType":"trust","confidence":"medium","observedAt":null,"isPublic":true}],"highlights":["Schema refs published","Trust evidence available"],"agentCard":{"name":"anime.js Best Practices","description":"This skill should be used when the user asks to \"animate elements\", \"add animations\", \"create transitions\", \"use anime.js\", \"implement motion\", \"add scroll animations\", \"create timeline animations\", \"stagger animations\", \"animate SVG\", \"add draggable elements\", or needs guidance on anime.js v4 patterns, easing, performance, or React/Next.js animation integration.","source":"GITHUB_OPENCLEW","sourceId":"github:1143317029","repository":"https://github.com/umbrellamode/animejs-best-practices","documentation":"https://www.xpersona.co/skill/umbrellamode-animejs-best-practices/agent/umbrellamode-animejs-best-practices","protocols":["OPENCLEW"],"languages":["typescript"],"install":{"command":"git clone https://github.com/umbrellamode/animejs-best-practices.git","ecosystem":"git"},"examples":[{"kind":"example","language":"javascript","snippet":"// Recommended: from main module\nimport { waapi, stagger, splitText } from 'animejs';\n\n// Or standalone (smallest bundle)\nimport { waapi } from 'animejs/waapi';"},{"kind":"example","language":"javascript","snippet":"// WAAPI - hardware accelerated, lightweight\nwaapi.animate('.element', {\n  translateX: 200,\n  rotate: 180,\n  opacity: [0, 1],\n  duration: 800,\n  ease: 'outExpo'\n});"}]}}