# Originkit

> Curated library of animated and interactive UI components for modern websites

Originkit is a component directory featuring interactive visual effects, WebGL backgrounds, and animated UI elements. It lets you test animations with live property controls and export them directly to React code, Framer, or AI coding assistants via MCP.

Website: https://originkit.dev/

## What it is for

- Add interactive canvas or WebGL background animations to a landing page
- Paste animated UI components directly into Framer projects
- Feed component code directly into AI coding tools like Cursor via MCP

## Features

- Over 500 animated and interactive components across categories like backgrounds, text, loaders, and galleries
- Live interactive customization sliders to tweak animation parameters before export
- Export options including direct code copying, Framer component copy, and MCP integration
- Catalog covering shaders, particle effects, ASCII waves, and cursor interactions
- Categorized sorting by trending, recently added, and most copied

## Pricing

Freemium. Free library access; Pro subscription required for select premium components

## Details

- Type: Web app
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [UI Components](https://xiry.app/topics/development/ui-components.md)
- Open source: no
- Platforms: Web
- For: Frontend developers and Framer web designers wanting advanced visual effects
- Alternative to: Aceternity UI, Magic UI, React Bits
- Tags: components, react, framer, animations, webgl, shaders

## Why it was saved

- [@setupsai, 11 July 2026](https://www.instagram.com/reel/DappXCcvuE3/): Enables developers and designers to easily drop high-end WebGL and canvas animations into their projects without building complex visual effects from scratch or creating an account.

## Compare

- [Alternatives to Aceternity UI](https://xiry.app/alternatives/aceternity-ui.md)
- [Alternatives to Magic UI](https://xiry.app/alternatives/magic-ui.md)

## Related

- [shadcn/ui](https://xiry.app/resources/shadcn-ui-1902): Copy-paste React UI components built with Tailwind CSS and Radix primitives. (Website, Open source)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [Motion](https://xiry.app/resources/motion): Open-source animation library for React, Vue, and vanilla JavaScript (Website, Freemium)
- [React Bits](https://xiry.app/resources/react-bits): Open-source animated and interactive React UI components and backgrounds (Website, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [lucide-animated](https://xiry.app/resources/lucide-animated): Open-source animated React icons built with Lucide and Motion (Web app, Open source)

Updated 3 October 2026. Page: https://xiry.app/resources/originkit

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.