CommandKey

Features

Simplicity

Write only a few lines of code. No more spaghetti code.

Full Customization

You can customize everything using Tailwind CSS classes.

Open Source

The source code is available for everyone!

Code Example

npm install commandkey

Ensure you have Tailwind CSS installed. Check the docs for more information

import { Command, CommandList, CommandInput, CommandOption } from 'commandkey';
import { useState } from 'react';

export default function App() {
  const [open, setOpen] = useState(false);

  return (
    <>
      <button onClick={() => setOpen(true)}>Open modal</button>

      <Command open={open} onClose={() => setOpen(false)}>
        <CommandInput placeholder="Search" />
        <CommandList>
          <CommandOption>Apple</CommandOption>
          <CommandOption>Orange</CommandOption>
          <CommandOption>Pear</CommandOption>
        </CommandList>
      </Command>
    </>
  );
}

Ready to get started?

Go to the docs