Color check

Your input controls can come in a variety of colors, depending on your preferences. Click here to see the list of available colors.

<label class="form-colorinput">
  <input name="color" type="radio" value="lime" class="form-colorinput-input" />
  <span class="form-colorinput-color bg-lime"></span>
</label>
<label class="form-colorinput">
  <input name="color-rounded" type="radio" value="dark" class="form-colorinput-input" />
  <span class="form-colorinput-color bg-dark rounded-circle"></span>
</label>

Input color picker

Add an color picker to your form to let users customise it according to their preferences.

<div class="mb-3">
  <label class="form-label">Color picker</label>
  <input type="color" class="form-control form-control-color" value="#0054a6" title="Choose your color">
</div>
Do you have a question? ask the community
Do you see a bug? open an issue on GitHub
Do you like Tabler? tweet about it!
Support Tabler's development: Github Sponsors
illustrations banner imageillustrations banner image dark
55 sleek illustrations for your startup's visual identity.