Using gems with your AI tool

If you build with an AI coding tool, you do not need to paste code by hand. There are two ways to hand it a gem.

Both give you React and Tailwind code for a code project. They do not make Webflow, Framer or Figma output. For those, use Copy to Webflow, Copy to Figma or Copy to Framer.

Copy a prompt

1. Open a gem and press Copy gem.
2. Open the Copy Prompt menu and pick your tool: Claude Code, Cursor, Windsurf, v0, Bolt, Lovable or Replit.
3. Paste the prompt into your tool.

The prompt holds the gem as a React and Tailwind example, plus instructions for fitting it into your project. If a gem has no prompt yet, you will see "Prompt not available yet for this gem".

When a gem uses GSAP, the prompt keeps the animation and its timing and names the package to install. You get the effect as designed, not a simplified copy.

Let your AI tool find gems

Connect BYQ to your own AI tool and it can search the gem library for you. Ask for what you want, for example: "Add a BYQ gem, magnetic hover on the primary button." It finds the gem and its prompt, then adds it to your project.

This needs Pro or Ultra. On Free, your AI tool replies that it needs a Pro or Ultra plan.

Next: connect your AI tool. The page has setup steps for each app.