Pages
Mail Settings
Users & Permissions
Transactions Report
Users
Denzel Washington
denzelwashington@left4code.com
Kevin Spacey
kevinspacey@left4code.com
Al Pacino
alpacino@left4code.com
Nicolas Cage
nicolascage@left4code.com
Products
Apple MacBook Pro 13
PC & Laptop
Sony A7 III
Photography
Nike Tanjun
Sport & Outdoor
Sony Master Series A9G
Electronic

## Tom Select

## Basic Select

Show example code
Basic
Nested

      HTMLOpenTag!-- BEGIN: Basic Select --HTMLCloseTag HTMLOpenTagdivHTMLCloseTag HTMLOpenTaglabelHTMLCloseTagBasicHTMLOpenTag/labelHTMLCloseTag HTMLOpenTagdiv class="mt-2"HTMLCloseTag HTMLOpenTagselect data-placeholder="Select your favorite actors" class="tom-select w-full"HTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag!-- END: Basic Select --HTMLCloseTag HTMLOpenTag!-- BEGIN: Nested Select --HTMLCloseTag HTMLOpenTagdiv class="mt-3"HTMLCloseTag HTMLOpenTaglabelHTMLCloseTagNestedHTMLOpenTag/labelHTMLCloseTag HTMLOpenTagdiv class="mt-2"HTMLCloseTag HTMLOpenTagselect data-placeholder="Select your favorite actors" class="tom-select w-full"HTMLCloseTag HTMLOpenTagoptgroup label="American Actors"HTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/optgroupHTMLCloseTag HTMLOpenTagoptgroup label="American Actresses"HTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagScarlett JohanssonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJessica AlbaHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagJennifer LawrenceHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagEmma StoneHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagAngelina JolieHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/optgroupHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag!-- END: Nested Select --HTMLCloseTag

## Multiple Select

Show example code

      HTMLOpenTagselect data-placeholder="Select your favorite actors" class="tom-select w-full" multipleHTMLCloseTag HTMLOpenTagoption value="1" selectedHTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3" selectedHTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag

## Header

Show example code

      HTMLOpenTagselect data-placeholder="Select your favorite actors" data-header="Actors" class="tom-select w-full" multipleHTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2" selectedHTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3" selectedHTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5" selectedHTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag

## Input Group

Show example code
@

      HTMLOpenTagdiv class="flex"HTMLCloseTag HTMLOpenTagdiv class="z-30 rounded-l w-10 flex items-center justify-center bg-slate-100 border text-slate-500 dark:bg-darkmode-700 dark:border-darkmode-800 dark:text-slate-400 -mr-1"HTMLCloseTag@HTMLOpenTag/divHTMLCloseTag HTMLOpenTagselect class="tom-select w-full"HTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag HTMLOpenTag/divHTMLCloseTag

## Disabled

Show example code

      HTMLOpenTagselect class="tom-select w-full" disabledHTMLCloseTag HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag

## Disabled Option

Show example code

      HTMLOpenTagselect class="tom-select w-full"HTMLCloseTag HTMLOpenTagoption value="1" disabledHTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="2"HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="3"HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="4" disabledHTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag HTMLOpenTagoption value="5"HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag HTMLOpenTag/selectHTMLCloseTag

Dark Mode