Tail Select

Pages

Users

Products

Samsung Galaxy S20 Ultra

Smartphone & Tablet

Notifications

Sylvester Stallone

01:10 PM

It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem

Brad Pitt

03:20 PM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Al Pacino

06:05 AM

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 20

Brad Pitt

05:09 AM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Johnny Depp

05:09 AM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Basic Select

Show example code

Basic

Nested

  HTMLOpenTagdivHTMLCloseTag HTMLOpenTaglabelHTMLCloseTagBasicHTMLOpenTag/labelHTMLCloseTag HTMLOpenTagdiv class="mt-2"HTMLCloseTag HTMLOpenTagselect data-search="true" class="tail-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 HTMLOpenTagdiv class="mt-3"HTMLCloseTag HTMLOpenTaglabelHTMLCloseTagNestedHTMLOpenTag/labelHTMLCloseTag HTMLOpenTagdiv class="mt-2"HTMLCloseTag HTMLOpenTagselect data-search="true" class="tail-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

Multi Select

Show example code

  HTMLOpenTagselect data-placeholder="Select your favorite actors" data-search="true" class="tail-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

Input Group

Show example code

  HTMLOpenTagdiv class="flex"HTMLCloseTag HTMLOpenTagdiv class="z-30 rounded-l w-10 flex items-center justify-center bg-gray-100 border text-gray-600 dark:bg-dark-1 dark:border-dark-4 -mr-1"HTMLCloseTag@HTMLOpenTag/divHTMLCloseTag HTMLOpenTagselect data-search="true" class="tail-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

Hiding Search Box

Show example code

  HTMLOpenTagselect class="tail-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