tabler/pages/_includes/forms/form-elements-2.html

<div class="mb-3">
   <label class="form-label">Username</label>
   {% include ui/form/input-group.html prepend="@" placeholder="username" %}
</div>

<div class="mb-3">
   <label class="form-label">Subdomain</label>
   {% include ui/form/input-group.html append=".tabler.io" placeholder="subdomain" %}
</div>

<div class="mb-3">
   <label class="form-label">Input with prepended text</label>
   {% include ui/form/input-group.html prepend="https://tabler.io/users/" class="input-group-flat" input-class="pl-0" %}
</div>

<div class="mb-3">
   <label class="form-label">Input with appended text</label>
   {% include ui/form/input-group.html append=".tabler.io" input-class="text-right pr-0" class="input-group-flat" %}
</div>

<div class="mb-3">
   <label class="form-label">Price</label>
   {% include ui/form/input-group.html prepend="$" append=".00" %}
</div>

<div class="mb-3">
   <label class="form-label">Button input</label>
   <div class="input-group">
      <div class="input-group-prepend">
         <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Action
         </button>
	      {% include ui/dropdown-menu.html %}
      </div>
      <input type="text" class="form-control" aria-label="Text input with dropdown button">
   </div>
</div>

<div class="mb-3">
   <label class="form-label">Tags</label>
   {% include ui/form/selectize.html key="tags" %}

</div>

<div class="mb-3">
   <label class="form-label">Top person</label>
   {% include ui/form/selectize.html key="users" %}
</div>

<div class="mb-3">
   <label class="form-label">Users list</label>
   {% include ui/form/selectize.html key="people" %}
</div>

<div class="mb-3">
   <label class="form-label">Countries</label>
   {% include ui/form/selectize.html key="countries" %}
</div>