Originkit

180 animated web components plus 48 page sections, for Framer, React and MCP

Tier A · StrongComponent LibraryRegistryAnimation Libraryoriginkit.dev

Originkit is a free registry of 180 animated components across nine categories (Text 62, Image Gallery 22, Cursor 20, Animations 17, Background 17, Image 15, Interactive Elements 13, Button 12, Border 2) plus 48 ready-made page sections (37 heroes, 4 features, 3 pricing, 2 CTA, 2 footer). Every component is authored Framer-first — default export, framer-motion, @framerSupportedLayoutWidth annotations — and can be pasted onto a Framer canvas as a code component, copied as .tsx, installed with its own CLI, or fetched by an agent over a hosted MCP server. The MCP server exposes four tools: list_components, get_component (adapts source to framer/react/nextjs/vite), search, and fetch. Aimed at people building marketing sites and landing pages who want awwwards-style motion without writing the animation themselves.

Install

npx originkit@latest add <component-name>

For an agent

Use the MCP server at https://mcp.originkit.dev/mcp rather than scraping the site — originkit.dev's robots.txt explicitly Disallows ClaudeBot and GPTBot, so a plain fetch returns 403 and you will get nothing. Call list_components with a category filter (text, button, border, image, image-gallery, cursor, interactive-elements, animation, background-animation) then get_component with stack=nextjs to get source with 'use client' already applied; the raw sources are Framer-first, so outside Framer the framer-motion property-control imports resolve to a no-op shim. Treat these as decoration for marketing pages only — they are heavy canvas/WebGL and cursor effects with no accessibility or reduced-motion story, so never put them inside an app shell or a form.

Why it is here. It is one of very few animated-component registries that ships a real MCP server with stack adaptation built in, and the 48 hero/pricing/footer sections make it a landing-page seed rather than just a bag of effects.

Install command, framework, licence and component list.

Facts

License: Unknown
Pricing: Free
Framework: Framer, React, Next.js, Vanilla JS
Styling: Inline styles, Unknown
Distribution: CLI installer, MCP server, Copy-paste snippet, npm package
Platform: Web
Content type: Code
Agent readiness: MCP server, CLI installable, Ships a ready LLM prompt, Copy-paste ready code, Blocks bots
Accessibility: Unknown
Maturity: Actively maintained
Pricing detail: Free. No paid tier or pricing page exists in the sitemap. The npm CLI package `originkit` (v0.2.23, published 2026-08-07) is MIT; the component sources themselves carry no stated license on the site.
Package: originkit

Components it ships

180 total

Text Effect Custom Cursor Hover Effect Button Image Gallery Image Carousel Marquee Typewriter Text Scroll Reveal Particle Background Animation Hero Pricing Table Footer Section

Helps you build

Homepage Features Pricing Website

Templates

Notable for

180 components, 48 page sections
MCP server with list_components/get_component/search/fetch
Framer-first authoring, pastes onto a Framer canvas
37 animated hero sections
robots.txt blocks ClaudeBot and GPTBot

Provenance

Verified 2026-08-15. HTTP 200. https://www.originkit.dev/ (403 to WebFetch/ClaudeBot; read via curl + decoded Next.js RSC payload), https://www.originkit.dev/sitemap.xml, https://www.originkit.dev/robots.txt, https://www.originkit.dev/intro, https://www.originkit.dev/integrations, Next.js chunk JS for the MCP endpoint and CLI, https://registry.npmjs.org/originkit

Also in Motion & Interaction

originkit.devTier A