Edit History

Here is a quick sample how you can change the up/down using only css. Also, you can add custom images. I used svg in my example.

This example only transforms cart page buttons. I think it is easily adaptable in other places.

.cart-grid .bootstrap-touchspin {
    position: relative;
    padding: 0 30px;
  }
  .cart-grid .bootstrap-touchspin .btn-touchspin {
    position: absolute;
    width: 30px;
    top: 0;
    bottom: 0;
    height: auto;
    padding: 0;
  }
  .cart-grid .bootstrap-touchspin .btn-touchspin i {
    position: initial;
    width: 100%;
    height: 100%;
    display: block;
  }
  .cart-grid .bootstrap-touchspin .btn-touchspin i::after {
    content: '';
  }
  
  .cart-grid .bootstrap-touchspin .input-group-btn-vertical {
    position: initial;
  }
  .cart-grid .bootstrap-touchspin .bootstrap-touchspin-up {
    right: 0;
  }
  .cart-grid .bootstrap-touchspin .bootstrap-touchspin-down {
    left: 0;
  }
  .cart-grid .bootstrap-touchspin .bootstrap-touchspin-up i {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 1a11 11 0 1 0 11 11A11.013 11.013 0 0 0 12 1zm0 20a9 9 0 1 1 9-9 9.011 9.011 0 0 1-9 9zm6-8a6 6 0 0 1-12 0 1 1 0 0 1 2 0 4 4 0 0 0 8 0 1 1 0 0 1 2 0zM8 10V9a1 1 0 0 1 2 0v1a1 1 0 0 1-2 0zm6 0V9a1 1 0 0 1 2 0v1a1 1 0 0 1-2 0z"/></svg>');
  }
  .cart-grid .bootstrap-touchspin .bootstrap-touchspin-down i {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8 11V9a1 1 0 0 1 2 0v2a1 1 0 0 1-2 0zm7 1a1 1 0 0 0 1-1V9a1 1 0 0 0-2 0v2a1 1 0 0 0 1 1zm-3 2a6.036 6.036 0 0 0-4.775 2.368 1 1 0 1 0 1.55 1.264 4 4 0 0 1 6.45 0 1 1 0 0 0 1.55-1.264A6.036 6.036 0 0 0 12 14zm11-2A11 11 0 1 1 12 1a11.013 11.013 0 0 1 11 11zm-2 0a9 9 0 1 0-9 9 9.01 9.01 0 0 0 9-9z"/></svg>');
  }