Segmented
<!-- segmented radio -->
<div class="btn-segmented inline-flex layhetgsjdcb rounded-sm cklsihrbanmq shadow-outset-fixed">
<label for="check4" class="segmented-item rounded-s-sm h-8 py-2 uajskeiolksb segmented-item btn-outline relative inline-flex klsuaonrmcha layhetgsjdcb yhansklopals gap-x-2 text-sm tracking-[.00714em] font-medium bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 shadow-inset-hover active">
<input id="check4" type="radio" name="radios" class="z-10 opacity-0 absolute inset-0" value="1" checked>
<span>one</span>
</label>
<label for="check5" class="segmented-item rounded-s-sm h-8 py-2 uajskeiolksb segmented-item btn-outline relative inline-flex klsuaonrmcha layhetgsjdcb yhansklopals gap-x-2 text-sm tracking-[.00714em] font-medium bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 shadow-inset-hover">
<input id="check5" type="radio" name="radios" class="z-10 opacity-0 absolute inset-0" value="2">
<span>two</span>
</label>
<label for="check6" class="segmented-item rounded-s-sm h-8 py-2 uajskeiolksb segmented-item btn-outline relative inline-flex klsuaonrmcha layhetgsjdcb yhansklopals gap-x-2 text-sm tracking-[.00714em] font-medium bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 shadow-inset-hover">
<input id="check6" type="radio" name="radios" class="z-10 opacity-0 absolute inset-0" value="3">
<span>three</span>
</label>
</div>
Chips
Chip 1
Chip 2
<!-- chips -->
<div class="flex flex-wrap layhetgsjdcb gap-2">
<div class="inline-flex klsuaonrmcha layhetgsjdcb gap-2 h-8 py-1 px-3 text-sm shadow-inset bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 rounded-[30px] tracking-[.00714em] active">Chip 1<button class="cursor-pointer">x</button></div>
<div class="inline-flex klsuaonrmcha layhetgsjdcb gap-2 h-8 py-1 px-3 text-sm shadow-inset bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 rounded-[30px] tracking-[.00714em]">Chip 2<button class="cursor-pointer">x</button></div>
<!-- with img -->
<div class="inline-flex klsuaonrmcha layhetgsjdcb gap-2 h-8 py-1 px-3 text-sm shadow-inset bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950 rounded-[30px] tracking-[.00714em]"><div class="w-6 h-6 boalstehwqbj bg-black mklausjenrhtm -ms-2">
<img alt="Chip 3" src="src/img/avatars/avatar.jpg" class="w-6 h-6"></div>
Chip 3
<button class="cursor-pointer">x</button>
</div>
</div>