<div class="wrapper">
  <select data-rich-select multiple>
    <option value="">選択してください</option>
  </select>
</div>

.wrapper {
  margin: 3rem;
}

new TomSelect(
  '[data-rich-select]',
  {
    valueField: 'value',
    labelField: 'label',
    searchField: 'label',
    options: [
      { group: 'front', value: 'html', label: 'HTML' },
      { group: 'front', value: 'css', label: 'CSS' },
      { group: 'front', value: 'javascript', label: 'JavaScript' },
      { group: 'front', value: 'typescript', label: 'TypeScript' },
      { group: 'back', value: 'nodejs', label: 'Node JS' },
      { group: 'back', value: 'php', label: 'PHP' },
    ],
    optgroups: [
      { value: 'front', label: 'フロントエンド' },
      { value: 'back', label: 'バックエンド' },
    ],
    optgroupField: 'group'
  }
)