## What is Kinetik? Kinetik is a collection of **50+ premium React components** designed for developers who care about user experience. Every component is built with smooth animations, full TypeScript support, and accessibility in mind. Kinetik components are designed to be copied and pasted into your project. No heavy dependencies, no lock-in. ## Key Features - **Buttery Smooth Animations** - Powered by Framer Motion, running at 60fps - **TypeScript First** - Full type safety and autocomplete out of the box - **Zero Config** - No complex setup, just copy and paste - **Accessible** - Built with ARIA best practices - **Customizable** - Easy to modify with CSS variables and Tailwind ## Philosophy We believe that great UI components should be: 1. **Copy-paste friendly** - You own the code, modify it however you want 2. **Performant** - Animations should never cause jank or lag 3. **Accessible** - Everyone should be able to use your application 4. **Beautiful by default** - Components should look great without customization ## Quick Example Here's a simple example of a Kinetik component in action: ```tsx import { MagneticButton } from '@/components/MagneticButton' export function Hero() { return (

Get Started Learn More

) } ``` ## Next Steps Set up Framer Motion and Tailwind CSS in your project. Browse our component library and copy what you need. Modify colors, animations, and styles to match your brand. Ready to get started? Head over to the [Installation guide](/docs/getting-started/installation).

Introduction

Introduction