Sun

Getting Started

Browse the library and pick the components you want to use in your project. Each component is designed to be copied and used immediately, no setup required.

When you find something you like, simply copy the code and paste it into your project.

All components are fully customizable, so you can freely adjust styles, structure, or behavior to fit your needs.

What is Kitleno?

Kitleno is a collection of modern React and Tailwind CSS components designed for fast development. Copy, paste, and customize components without any setup or dependencies.

How it works

  • Copy → Paste → Customize
  • No dependencies (except icons)
  • No configuration required to get started

You can use the components exactly as they are, or treat them as a starting point for your own designs.

Icon Usage

Many components use icons from Lucide.

npm install lucide-react

You can explore all available icons in the Lucide documentation.

If you prefer another icon library, you can easily replace them, the components are not tied to Lucide.

Dark & Light Mode Support

All components are styled using Tailwind’s built-in dark mode support.

  • If your project does not use dark mode, components will render in light mode by default
  • If your project supports dark mode, components will automatically adapt based on the active theme

If you want to quickly enable dark/light mode in your project, you can use the prebuilt dark mode component included in this library.

Component Customization

These components are meant to be flexible.

  • Change colors
  • Adjust spacing and layout
  • Modify structure or behavior

Think of them as building blocks, not fixed components.

Start building faster

Browse the component library and start copying ready-to-use React components into your project.