<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text" id="basic-addon1">example.com@</span>
  </div>
  <input type="text" class="form-control" placeholder="نام کاربری گیرنده" aria-label="Username" aria-describedby="basic-addon1">
</div>

<div class="input-group mb-3">
  <input type="text" class="form-control" placeholder="نام کاربری" aria-label="Recipient's username"
    aria-describedby="basic-addon2">
  <div class="input-group-append">
    <span class="input-group-text" id="basic-addon2">@</span>
  </div>
</div>

<label for="basic-url">آدرس اینترنتی شما (URL)</label>
<div class="input-group mb-3">
<input type="text" class="form-control dirltr" id="basic-url" aria-describedby="basic-addon3">
  <div class="input-group-prepend">
    <span class="input-group-text dirltr" id="basic-addon3">https://example.com/users/</span>
  </div>
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text">$</span>
  </div>
  <input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
  <div class="input-group-append">
    <span class="input-group-text">.00</span>
  </div>
</div>

          

<label class="text-dark font-weight-medium" for="">افزونه چک باکس سمت راست</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <div class="input-group-text">
      <label class="control control-checkbox d-inline-block mb-0">
        <input type="checkbox" name="checkbox1" />
        <div class="control-indicator"></div>
      </label>
    </div>
  </div>
  <input type="text" class="form-control" aria-label="Text input with checkbox">
</div>

<label class="text-dark font-weight-medium" for="">افزونه رادیو سمت چپ</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <div class="input-group-text">
      <label class="control control-radio d-inline-block mb-0">
        <input type="radio" name="radio1" />
        <div class="control-indicator"></div>
      </label>
    </div>
  </div>
  <input type="text" class="form-control" aria-label="Text input with radio button">
</div>


          

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true"
      aria-expanded="false">عملیات</button>
    <div class="dropdown-menu">
      <a class="dropdown-item" href="#">عملیات</a>
      <a class="dropdown-item" href="#">عملیات دیگر</a>
      <a class="dropdown-item" href="#">یه چیز دیگه اینجا</a>
      <div role="separator" class="dropdown-divider"></div>
      <a class="dropdown-item" href="#">پیوند جدا شده</a>
    </div>
  </div>
  <input type="text" class="form-control" aria-label="Text input with dropdown button">
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <button class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true"
      aria-expanded="false">عملیات</button>
    <div class="dropdown-menu">
      <a class="dropdown-item" href="#">عملیات</a>
      <a class="dropdown-item" href="#">عملیات دیگر</a>
      <a class="dropdown-item" href="#">یه چیز دیگه اینجا</a>
      <div role="separator" class="dropdown-divider"></div>
      <a class="dropdown-item" href="#">پیوند جدا شده</a>
    </div>
  </div>
  <input type="text" class="form-control" aria-label="Text input with dropdown button">
</div>

          

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-account" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" placeholder="نام کاربری" aria-label="Username" aria-describedby="basic-addon1">
</div>

<div class="input-group mb-3">
  <input type="text" class="form-control" placeholder="تنظیمات" aria-label="Recipient's username"
    aria-describedby="basic-addon2">
  <div class="input-group-append">
    <span class="input-group-text mdi mdi-settings" id="basic-addon2"></span>
  </div>
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-home" id="basic-addon3"><span class="mr-2">example.com</span></span>
  </div>
  <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-email"></span>
  </div>
  <input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
  <div class="input-group-append">
    <span class="input-group-text mdi mdi-map-marker"></span>
  </div>
</div>

          

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <button class="btn btn-primary" type="button">برو</button>
  </div>
  <input type="text" class="form-control" aria-label="Text input with dropdown button" placeholder="جستجو برای ...">
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <button class="btn btn-secondary" type="button">برو</button>
  </div>
  <input type="text" class="form-control" aria-label="Text input with dropdown button" placeholder="جستجو برای ...">
</div>

<div class="input-group mb-3">
  <input type="text" class="form-control" placeholder="تنظیمات" aria-label="Recipient's username"
    aria-describedby="basic-addon2" placeholder="جستجو برای ...">
  <div class="input-group-prepend">
    <button class="btn btn-primary" type="button">برو</button>
  </div>
</div>

<div class="input-group mb-3">
  <input type="text" class="form-control" placeholder="تنظیمات" aria-label="Recipient's username"
    aria-describedby="basic-addon2" placeholder="جستجو برای ...">
  <div class="input-group-prepend">
    <button class="btn btn-primary" type="button">برو</button>
  </div>
</div>

          

<div class="input-group input-group-sm mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-account" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" placeholder="نام کاربری" aria-label="Username" aria-describedby="basic-addon1">
</div>

<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-account" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" placeholder="نام کاربری" aria-label="Username" aria-describedby="basic-addon1">
</div>

<div class="input-group input-group-lg mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-account" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" placeholder="نام کاربری" aria-label="Username" aria-describedby="basic-addon1">
</div>