Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

15 St Margarets, NY 10033
(+381) 11 123 4567



Fast Portable Extensible CMD+k Component For React – kbar

kbar is a simple plug-n-play React component to add a fast, portable, and extensible COMMAND+k (CTRL+K) interface to your site.


  • Built in animations and fully customizable components
  • Keyboard navigation support; e.g. ctrl n / ctrl p for the navigation wizards
  • Keyboard shortcuts support for registering keystrokes to specific actions; e.g. hit t for Twitter
  • Nested actions enable creation of rich navigation experiences; e.g. hit backspace to navigate to the previous action
  • A simple data structure which enables anyone to easily build their own custom components

How to use it:

1. Install and import the kbar component.

$ npm i kbar
import { KBarProvider } from "kbar";

2. Add the <KBarProvider> component to the app.

return (
  <KBarProvider actions={actions}>
    <App />

3. Add your own actions to the CMD+k interface.

const actions = [
    id: "action1",
    name: "Action 1",
    shortcut: ["A"],
    keywords: "Action 1 Keyword",
    perform: () => (...),
    id: "action2",
    name: "Action 2",
    shortcut: ["B"],
    keywords: "Action 2 Keyword",
    perform: () => (...),
  // ...


Download Details:

Author: timc1

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/timc1/kbar

License: MIT

Credit: Source link

Previous Next
Test Caption
Test Description goes like this