'Switch' and 'Toggle' are two new molds for checkbox added since ZK 8.6.

To use these controls, simply specify, for example, <checkbox mold="switch"/>.

<zk>
	<grid id="settings">
		<columns>
			<column/>
			<column width="100px"/>
		</columns>
		<auxhead>
			<auxheader colspan="2" label="Synchronization Settings"/>
		</auxhead>
		<rows>
			<row>
				Email
				<checkbox mold="switch" checked="true"/>
			</row>
			<row>
				Calendar
				<checkbox mold="switch"/>
			</row>
			<row>
				Favorites (disabled)
				<checkbox mold="switch" checked="true" disabled="true"/>
			</row>
			<row>
				Logins (disabled)
				<checkbox mold="switch" disabled="true"/>
			</row>
		</rows>
	</grid>
</zk>

<zk>
	<groupbox closable="false" sclass="z-demo-config">
		<caption>Checkbox Mold</caption>
		<radiogroup>
			<attribute name="onCheck"><![CDATA[
				for(Checkbox cb : settings.queryAll("checkbox")) {
					cb.setMold(self.getSelectedItem().getValue());
				}
			]]></attribute>
			<vlayout>
				<radio label="Switch" value="switch" checked="true"/>
				<radio label="Toggle" value="toggle" />
				<radio label="Default" value="default" />
			</vlayout>
		</radiogroup>
	</groupbox>
</zk>