Note: This article uses Framer’s code features. Find out how to enable code features in your project.
A Code Component is an advanced type of component. It is similar to a Design Component, except that its master is written in code.
Using Code Components
Framer includes a default set of Code Components that you can find in the Insert Menu. Many of Framer's community Packages also include Code Components.
Like Design Components, Code Components can expose Property Controls that change certain properties in the component. If a Code Component has Property Controls, then the Properties Panel will list these inputs in a section with the component's name as its header.
A Code Component's Property Controls are written in code by the component's author. The controls themselves may be more complex than those found in Design Components, and it's up to the component's author to determine how their values are used.
To learn more about a Code Component's properties, open the Insert Menu and select the component to read its description.
Learn more in our article on using Property Controls with Code Components.