---

Features

- 1,600+ icons: Access to the complete Lucide Icons library
- Smart search: Quickly find icons with intelligent search functionality
- Responsive design: Works seamlessly on desktop and mobile devices
- High performance: Virtualized rendering and lazy loading for smooth experience
- Configurable: Flexible options for filtering icons
- Preview support: Built-in preview function for Sanity Studio

---

Installation

``sh
pnpm add sanity-plugin-lucide-icon-picker


or

`ts
// sanity.config.ts
import { defineConfig } from 'sanity';
import { lucideIconPicker } from 'sanity-plugin-lucide-icon-picker';

export default defineConfig({
// ...
plugins: [lucideIconPicker()],
});
`

2. Use the lucide-icon type in your schema:

`ts
// schemas/myDocument.ts
import { defineType } from 'sanity';

export default defineType({
name: 'myDocument',
title: 'My Document',
type: 'document',
fields: [
{
name: 'icon',
title: 'Icon',
type: 'lucide-icon',
},
// ... other fields
],
});
`

---

Configuration Options

$3

Limit available icons to a specific whitelist:

`ts
{
name: 'icon',
title: 'Social Icon',
type: 'lucide-icon',
options: {
allowedIcons: ['facebook', 'twitter', 'instagram', 'linkedin'],
}
}
`

The allowedIcons option accepts an array of icon names (in kebab-case format) to show only those specific icons in the picker.

---

Frontend Integration

$3

Icons are stored as kebab-case strings (e.g., "arrow-right", "chevron-down"). Use Lucide's DynamicIcon component to render them:

`jsx
import { DynamicIcon } from 'lucide-react/dynamic';

// Your Sanity data
const iconName = 'arrow-right'; // from your Sanity document

// Usage
export default function MyComponent() {
return (


1. Use dynamic imports to load only needed icons
2. Consider using the allowedIcons` option to limit available icons

---

Requirements

- Sanity Studio v3 or v4
- React 18 or 19
- TypeScript (recommended)

---

License

MIT © ContentWrap

---

About the Developer

This package is developed and maintained by ContentWrap, a digital product agency specializing in Sanity and modern web development.