With hundreds of gems, a search and a few filters get you to the right one fast.
Start from a sub-page
- Popular: the most-copied gems. Switch the period between Last 24 hours, Last week, Last month and All time.
- Recently added: the newest gems first.
- Free: gems you can copy on any plan.
- Categories: browse by kind of effect.
Search and filter
- Type what you want in the search box, for example "marquee" or "cursor".
- Use Category to pick the kind of gem.
- Use Interaction to pick what sets it off, such as Hover or Scroll.
- Use License to show only Free or Pro gems.
- Use Format to show only gems that come in the format you build in: HTML, Webflow, Figma or Framer.
Press Reset to clear every filter. If the list comes up empty, a filter is probably too narrow, so reset and try again.
Open a gem
Click a gem to open its page. You can play with the live preview. Badges show its categories and interactions, and a GSAP badge means it uses the GSAP animation library. If the gem has a written tutorial, it sits below the preview.
Tap the heart to save a gem to your favourites. Favourites work on every plan, Free included.
Next: copy it into your project.
Copy a gem into Webflow, Figma or Framer, as plain HTML, or as a prompt for your AI tool.
