diff --git a/css/backoffice/vendors/_tomselect.scss b/css/backoffice/vendors/_tomselect.scss
new file mode 100644
index 000000000..74cdeddf2
--- /dev/null
+++ b/css/backoffice/vendors/_tomselect.scss
@@ -0,0 +1,3 @@
+@import "../../../node_modules/tom-select/dist/scss/tom-select.scss";
+
+$select-color-item-active-border: $ibo-input--focus--border-color;
\ No newline at end of file
diff --git a/js/forms/custom-elements/tom-select.js b/js/forms/custom-elements/tom-select.js
index e4531a795..68c0ffdff 100644
--- a/js/forms/custom-elements/tom-select.js
+++ b/js/forms/custom-elements/tom-select.js
@@ -1,8 +1,32 @@
 class TomSelectElement extends HTMLSelectElement {
+	plugins = [];
 	connectedCallback() {
-			new TomSelect(this, {
+		if (this.getAttribute('data-tom-select-multiple')) {
+			this.plugins.push('remove_button');
+		}
 
-			});
+		const options = {
+			plugins: this.plugins,
+			wrapperClass: 'ts-wrapper ibo-input-wrapper ibo-input-select-wrapper--with-buttons ibo-input-select-autocomplete-wrapper',
+			controlClass: 'ts-control ibo-input ibo-input-select ibo-input-select-autocomplete',
+			render: {
+				dropdown: function (data, escape) {
+					return `<div class="selectize-dropdown"></div>`;
+				}
+			}
+		};
+
+		if (this.getAttribute('data-tom-select-disable-control-input')) {
+			options.controlInput = null;
+		}
+		if (this.getAttribute('data-tom-select-max-items-selected')) {
+			options.maxItems = parseInt(this.getAttribute('data-tom-select-max-items-selected'));
+		}
+		if (this.getAttribute('data-tom-select-placehelder')) {
+			options.placeholder = this.getAttribute('data-tom-select-placehelder');
+		}
+
+		new TomSelect(this, options);
 	}
 }
 
diff --git a/templates/application/forms/itop_console_layout.html.twig b/templates/application/forms/itop_console_layout.html.twig
index 3df4f6264..54122ac61 100644
--- a/templates/application/forms/itop_console_layout.html.twig
+++ b/templates/application/forms/itop_console_layout.html.twig
@@ -23,7 +23,13 @@
 
 {%- block choice_widget_collapsed -%}
     {% set attr = attr|merge({class: (attr.class|default('') ~ ' ibo-input')|trim}) %}
-    <select is="tom-select-element" class="field_autocomplete ibo-input ibo-input-select ibo-input-select-autocomplete ui-autocomplete-input" {{ block('widget_attributes') }}{% if multiple %} multiple="multiple"{% endif %}>
+    <select is="tom-select-element" class="field_autocomplete ibo-input ibo-input-select ibo-input-select-autocomplete ui-autocomplete-input"
+        {{ block('widget_attributes') }}
+        {% if multiple %} multiple="multiple" data-tom-select-multiple="true" {% endif %}
+        {% if max_items_selected is defined %} data-tom-select-max-items="{{ max_items_selected }}" {% endif %}
+        {% if placeholder is defined %} data-tom-select-placeholder="{{ placeholder }}" {% endif %}
+        {% if disable_input is defined%} data-tom-select-disable-control-input=true {% endif %}
+    >
         {%- if placeholder is not none -%}
             <option value=""{% if placeholder_attr|default({}) %}{% with { attr: placeholder_attr } %}{{ block('attributes') }}{% endwith %}{% endif %}{% if required and value is empty %} selected="selected"{% endif %}>{{ placeholder != '' ? (translation_domain is same as(false) ? placeholder : placeholder|trans({}, translation_domain)) }}</option>
         {%- endif -%}