How does this skill handle Framer Property Controls?

The skill provides templates and guidance for using the addPropertyControls API, allowing you to expose React props like numbers, strings, and colors directly in the Framer UI.

What is the Framer Core Workflow B skill?

It is a specialized capability for Claude Code that assists in creating advanced React components, property controls, and code overrides for Framer web projects.

What is the difference between components and overrides in this skill?

Components are custom-built React elements, while Overrides are reusable functions applied to existing Framer layers to modify their behavior or animation state.

Can I use this for API integration in Framer?

Yes, it includes specific patterns for data-fetching components that can pull information from external REST APIs and render them on the Framer canvas.

Framer Code Components & Overrides

Name: Framer Code Components & Overrides
Author: jeremylongshore

byjeremylongshore

•

2,027

•

设计工具

Develops custom React components and reusable code overrides for Framer sites with integrated property controls and animations.

This skill provides a comprehensive workflow for building high-performance React components and sophisticated code overrides within the Framer environment. It enables developers to implement interactive elements like animated counters, data-driven lists, and reusable scroll/hover animations that go beyond the standard Framer design tools. By leveraging Claude Code, this skill automates the creation of property controls and programmatic file generation, ensuring your custom Framer logic follows best practices for both performance and maintainability.

主要功能

01Build React components with dynamic Framer Property Controls

022,027 GitHub stars

03Create reusable code overrides for advanced animations and interactions

04Implement data-fetching components for external API integration

05Integration with Framer Motion for high-fidelity UI effects

06Programmatic generation of TSX code files using Framer Plugin APIs

使用场景

01Connecting a Framer site to an external JSON API to display dynamic content

02Building an animated counter component that triggers on scroll visibility

03Developing a library of reusable hover and scroll-based animation overrides

主要功能

01Build React components with dynamic Framer Property Controls

022,027 GitHub stars

03Create reusable code overrides for advanced animations and interactions

04Implement data-fetching components for external API integration

05Integration with Framer Motion for high-fidelity UI effects

06Programmatic generation of TSX code files using Framer Plugin APIs

使用场景

01Connecting a Framer site to an external JSON API to display dynamic content

02Building an animated counter component that triggers on scroll visibility

03Developing a library of reusable hover and scroll-based animation overrides