How to use
Find out how to start using Components easily.
01
Find Figma Components
Browse and explore the collection of ready-made components.
02
Copy Component
Choose a component and copy it to your clipboard.
03
Paste into Figma
Use CMD+V / CTRL+V to place the component on your Figma Workspace.
01
Find Webflow Components
Browse and explore the collection of ready-made components.
02
Copy Component
Choose a component and copy it to your clipboard.
03
Paste into Webflow
Select the <body> element and drop the component in. Need help? Contact our team.
01
Find framer Components
Browse and explore the collection of ready-made components.
02
Copy Component
Choose a component and copy it to your clipboard.
03
Paste into Framer
Use CMD+V / CTRL+V to place the component on your Framer Workspace.
04
Fill Component
Once you’ve pasted the component, adjust its width to ‘Fill’ at the Desktop breakpoint. If you skip this step, the layout may shift or appear misaligned on responsive screens.
05
Responsive Screens
Choose the canvas, then hit the “+” button to create custom breakpoints in addition to the default Tablet and Phone options.
06
Unlink Component
Double-click the section, then select “Unlink & Replace All” to detach the component and merge it fully into your project.
07
Detach Instance
If you want to edit the component freely, just right-click and choose “Detach Instance.
08
Replace Elements
Right-click elements (like buttons) and swap them with components from your style guide to keep your design consistent.
