Copying a gem

Press Copy gem, choose where it is going, and paste. It works in Webflow, Figma, Framer, plain HTML or your AI tool.
Works with
  • Webflow
  • Figma
  • Framer
  • HTML
  • AI coding tools

Press Copy gem on any gem, pick where it is going, then paste it there.

Choose a format
  • Copy to Webflow: paste onto the canvas in the Webflow Designer.
  • Copy to Figma: paste into a Figma file.
  • Copy to Framer: copies a Framer link as text. Paste it into your Framer canvas.
  • Copy HTML: for plain HTML sites and Embeds. A window opens with the code in three boxes.
  • Copy Prompt: a ready-made instruction for your AI coding tool.

A gem only lists the formats it has. To find gems that come in yours, set the Format filter.

Where the three boxes go

Copy each box into its own place:

  • HTML: the part that appears on the page. Paste it into an Embed or your page body.
  • CSS: the styling. Paste it in your page head. In Webflow, open Page settings, then Custom code, and use Head.
  • JS: the script that makes it move. Paste it just before the end of the page. In Webflow, use Footer in the same place.

Want files instead? Download all saves the gem as a zip. If the gem has a tutorial, use the Code and Tutorial tabs to switch.

Copy Prompt

Open the Copy Prompt menu and pick your tool: Claude Code, Cursor, Windsurf, v0, Bolt, Lovable or Replit. Then paste into that tool.

If it did not work
  • Signed out: choosing a copy option takes you to sign up.
  • A lock icon: that gem is Pro. On Free it opens the upgrade screen. Free gems copy normally. See pricing.
  • "You've hit the hourly copy limit.": wait a little and try again. Limits explained.

Next: use gems with your AI tool.

Give a gem to your AI coding tool as a prompt, or let your AI tool find gems for you.