A collection of resources for working with Framer.
Claude Code skills that teach Claude how to build Framer components and plugins. See skills/README.md for installation instructions and detailed coverage.
| Skill | Description |
|---|---|
| framer-code-components-overrides | Code Components, Code Overrides, property controls, WebGL shaders, and common patterns |
| framer-plugins | Framer Plugin SDK — ManagedCollection API, CMS sync, plugin modes, UI patterns, permissions, Marketplace submission |
Workarounds and tricks for Framer.
| Hack | Description |
|---|---|
| Hide 'Made in Framer' badge | Hide the Framer badge on published sites |
| Safari SVG animation fix | Fix choppy SVG animations on Safari |
| Magnetic hover effect | Elements that follow the cursor on hover |
| Force NPM package version | Bypass Framer's package cache with esm.sh |
| Shared state between overrides | Make multiple elements react to each other |
| Show element only once | Show popups/banners only on first visit |
| Auto-sized text fix | Fix text collapse in auto-sized components |
2026-03-24 — Added Framer Marketplace requirements to framer-plugins skill
2026-03-11 — Added HLS video streaming pattern (dynamic HLS.js import with silent fallback, SSR guard, adaptive bitrate). New pitfall entry for pixelated .m3u8 streams in Chrome.
2026-03-02 — Added framer-plugins skill (Plugin SDK, ManagedCollection API, CMS sync). Restructured repo.
2026-02-10 — Added React Portal pattern for z-index stacking context, loading states with scroll lock, and easing curves for lerp animations with initial distance tracking.
2026-02-02 — Added advanced gotchas: startTransition requirement, ResponsiveImage/File defaultValue workaround, variant-to-font-weight mapping, and more property control tips.
2026-01-30 — First skill + hacks
MIT
