Components
The Color Picker component offers a user-friendly interface, enabling effortless selection from a spectrum of colors to enhance web design and user experience.
By default Preline UI uses Tailwind CSS Forms plugin. Don't forget to install it!
Set the type="color"
to the <input>
.
<label for="hs-color-input" class="block text-sm font-medium mb-2 dark:text-white">Color picker</label>
<input type="color" class="p-1 h-10 w-14 block bg-white border border-gray-200 cursor-pointer w-10 rounded-lg disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700" id="hs-color-input" value="#2563eb" title="Choose your color">