Tom Select

Basic Select

            
                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="6"HTMLCloseTagScarlett JohanssonHTMLOpenTag/optionHTMLCloseTag
                                            HTMLOpenTagoption value="7"HTMLCloseTagJessica AlbaHTMLOpenTag/optionHTMLCloseTag
                                            HTMLOpenTagoption value="8"HTMLCloseTagJennifer LawrenceHTMLOpenTag/optionHTMLCloseTag
                                            HTMLOpenTagoption value="9"HTMLCloseTagEmma StoneHTMLOpenTag/optionHTMLCloseTag
                                            HTMLOpenTagoption value="10"HTMLCloseTagAngelina JolieHTMLOpenTag/optionHTMLCloseTag
                                        HTMLOpenTag/optgroupHTMLCloseTag
HTMLOpenTag/selectHTMLCloseTag
                                HTMLOpenTag/divHTMLCloseTag
                            HTMLOpenTag/divHTMLCloseTag
                            HTMLOpenTag!-- END: Nested Select --HTMLCloseTag
            
        

Multiple Select

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

Header

            
                HTMLOpenTagselect data-placeholder="Select your favorite actors" data-header="Actors" multiple="multiple" class="tom-select w-full"HTMLCloseTag
    HTMLOpenTagoption value="1"HTMLCloseTagLeonardo DiCaprioHTMLOpenTag/optionHTMLCloseTag
                                HTMLOpenTagoption
                                    value="2"
                                    selected
                                HTMLCloseTagJohnny DeepHTMLOpenTag/optionHTMLCloseTag
                                HTMLOpenTagoption
                                    value="3"
                                    selected
                                HTMLCloseTagRobert Downey, JrHTMLOpenTag/optionHTMLCloseTag
                                HTMLOpenTagoption value="4"HTMLCloseTagSamuel L. JacksonHTMLOpenTag/optionHTMLCloseTag
                                HTMLOpenTagoption
                                    value="5"
                                    selected
                                HTMLCloseTagMorgan FreemanHTMLOpenTag/optionHTMLCloseTag
HTMLOpenTag/selectHTMLCloseTag
            
        

Input Group

@
            
                HTMLOpenTagdiv class="flex"HTMLCloseTag
                                HTMLOpenTagdiv class="flex"HTMLCloseTag
                                    HTMLOpenTagdiv
                                        class="z-30 -mr-1 flex w-10 items-center justify-center rounded-l border bg-slate-100 text-slate-600 dark:border-darkmode-800 dark:bg-darkmode-700 dark:text-slate-400"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
                            HTMLOpenTag/divHTMLCloseTag
            
        

Disabled

            
                HTMLOpenTagselect disabled="disabled" 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
            
        

Disabled Option

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