Give one Component multiple states with the Agent

Framer
2,325 views •

Learn how Components and instances in Framer keep repeated buttons, cards, navigation, and other interface elements consistent across a project. This lesson shows how to create Components with the Agent or manually, replace matching elements with connected instances, use the Component canvas and Assets, and extend Components with Variants, states, and variables. 00:00 Why Components matter 00:20 Create Components with the Agent 00:40 Replace repeated elements with instances 02:03 Create a Component manually 02:21 Use the Component canvas and Assets 03:24 Add Variants, states, and variables Sign up: https://framer.link/yt Follow: https://framer.link/yt-x Learn: https://framer.link/yt-academy

Keyboard shortcuts

On. Switch them off if they collide with your assistive tools; ? still opens this sheet.

Go to

Press g then the letter.

  • gh Latest
  • gs Sources
  • gm Media
  • gv Videos
  • gp Podcasts
  • gc Calendar
  • gd Decoder
  • gz Dataviz
  • ga Datasets
  • gb Blog
  • gk Markets
  • gj Careers
  • gn Prompt Notebook

On this page

  • / Focus search, where there is one
  • t Back to top
  • ? This list
  • Esc Close