# Getting Started

> Install and use @gallerykit/lightbox.

Source: https://gallerykit.n.yatsyk.com/docs/lightbox/getting-started

# Getting Started with @gallerykit/lightbox

## 1. Install

```bash
pnpm add @gallerykit/lightbox
```

If your app does not yet depend on `@gallerykit/core`, the package will pull it in automatically.

## 2. Use it

```tsx
import { Lightbox, useLightbox } from "@gallerykit/lightbox";

export function ItemRow({ items }: { items: GalleryItem[] }) {
  const lb = useLightbox(items);
  return (
    <>
      {items.map((item, i) => (
        <button key={item.id} onClick={() => lb.open(i)}>
          <img src={item.src} alt={item.alt} />
        </button>
      ))}
      <Lightbox {...lb} />
    </>
  );
}
```

## Next steps

* Read the [API reference](./api.mdx) for the full list of exports.
* Browse the rest of the [GalleryKit docs](/docs) to see which layouts, skins, and themes are available.