Form control rounded {% include ui/form/input-icon.html input-class="form-control-rounded" %}

Form control flush

Input group {% include ui/form/input-group.html prepend="@" placeholder="username" class="mb-2" %} {% include ui/form/input-group.html append=".tabler.io" placeholder="subdomain" class="mb-2" %} {% include ui/form/input-group.html prepend="https://" append=".tabler.io" placeholder="subdomain" %}

Input with checkbox or radios {% include ui/form/input-group.html prepend="checkbox" class="mb-2" %} {% include ui/form/input-group.html append="radio" %}

Input with prepended text {% include ui/form/input-group.html prepend="https://tabler.io/users/" class="input-group-flat" input-class="pl-0" value="yourfancyusername" %}

Input with appended text {% include ui/form/input-group.html append=".tabler.io" input-class="text-right pr-0" class="input-group-flat" value="yourfancydomain" %}

Input with appended link {% include ui/form/input-group.html append-link="Show password" class="input-group-flat" type="password" value="ultrastrongpassword" %}

Input with appended icon links {% include ui/form/input-group.html append-button="x:Clear search,sliders:Search settings,bell:Add notification" class="input-group-flat" %}