Introduction
Originkit is a collection of production-ready components, interactions, and UI patterns built for both React and Framer. Copy components directly into your codebase or duplicate them inside Framer and customize them to fit your project.
Built for designers, developers, and teams who care about great user experiences.
This is more than a component library. It's a platform for discovering, copying, and shipping high-quality UI faster.
Why Originkit?
Building polished interfaces takes time. Every interaction, animation, and micro-detail requires design, development, testing, and refinement.
Most libraries focus on basic building blocks. Originkit focuses on the experiences users actually notice.
From animated buttons and navigation patterns to complex interactions and complete UI sections, every component is designed to help you create products that feel modern and engaging.
Cross-Platform Components
Every component is available across multiple workflows.
Copy React code.
No rebuilding. No recreating animations from scratch.
Duplicate components.
Keep design and development aligned.
Align design, development.
Use the same interaction patterns everywhere.
Designed for Speed
Whether you're building a startup, client project, SaaS product, or marketing site, Originkit helps you move from idea to implementation faster.
Browse components. Copy what you need. Customize it. Ship it.
Built for Modern Teams
Originkit bridges the gap between design and development by providing components that work across tools and workflows.
The result is a faster process, better consistency, and less time spent recreating the same UI patterns.
Create better experiences. Ship faster.
Open & Customizable
Originkit gives you full control over every component.
Edit styles and layouts.
Customize animations and motion.
Customize animations.
Adapt components to your design system.
Adapt components to system.
Extend functionality without limitations.