import panel as pn
pn.extension()

toggle = pn.widgets.Toggle(name='Toggle', button_type='success')

toggle

toggle.value

pn.Row(
    *(pn.Column(*(pn.widgets.Toggle(name=p, button_type=p, button_style=bs) for p in pn.widgets.Toggle.param.button_type.objects))
    for bs in pn.widgets.Toggle.param.button_style.objects)
)

backward = pn.widgets.Toggle(name='\u25c0', width=50)
forward = pn.widgets.Toggle(name='\u25b6', width=50)
search = pn.widgets.Button(name='🔍', width=100)
play = pn.widgets.Toggle(name="▶️ Play", width=100)
pause = pn.widgets.Toggle(name="Pause ⏸️", width=100)

pn.Row(backward, forward, search, play, pause)

pn.widgets.Toggle(icon='2fa', button_type='light', icon_size='2em')

shuffle_icon = """
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrows-shuffle" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
  <path d="M18 4l3 3l-3 3" />
  <path d="M18 20l3 -3l-3 -3" />
  <path d="M3 7h3a5 5 0 0 1 5 5a5 5 0 0 0 5 5h5" />
  <path d="M21 7h-5a4.978 4.978 0 0 0 -3 1m-4 8a4.984 4.984 0 0 1 -3 1h-3" />
</svg>
"""

pn.widgets.Toggle(icon=shuffle_icon, button_type='success', name='Shuffle', icon_size='2em')

pn.Row(toggle.controls(jslink=True), toggle)