Svelte Perfect Select

A modern, feature-rich select component for Svelte applications. React-select compatible with enhanced animations and 7 beautiful themes.

Try Playground Documentation

Features

🎨

7 Color Themes

Beautiful pre-built themes: blue, purple, green, red, orange, pink, dark

⚡

React-Select Compatible

Familiar API for developers coming from React ecosystem

🔍

Smart Search

Built-in search with custom filter support

🎯

Multi-Select

Select multiple options with animated tag chips

🌐

Async Loading

Load options dynamically with caching

✨

Creatable

Allow users to create new options

📦

Grouping & Badges

Organize options with groups, icons, and badges

♿

Fully Accessible

ARIA labels, keyboard navigation, screen reader support

Quick Start

Installation

npm install svelte-perfect-select

Basic Usage

<script>
  import Select from 'svelte-perfect-select';

  let value = null;
  let options = [
    { id: 'opt1', label: 'Option 1', value: 'opt1' },
    { id: 'opt2', label: 'Option 2', value: 'opt2' },
  ];
</script>

<Select {options} bind:value />

Ready to get started?

Explore the playground and see all features in action

Open Playground