# Introduction

The hhl-switch component replaces the standard html with a design and a multitude of options.

# Data binding Boolean

# Data binding Array

# Size by property

You can change the size by setting the property size="number"
The default is 20.

# Color by property

You can change the color by setting the color="colorValue"

# Color by theme colors

You can change the color by setting the color="bg-themeColor"
The theme colors are bg-pri bg-sec bg-ok bg-err bg-warn bg-info bg-black bg-white
The default is: bg-pri

# Disabled

Disabled by adding disabled

# CSS Variables

Name	Default	Describtion
--hhl-switch-color	Theme: --col-pri	The background color when checked.
--hhl-switch-unchecked-color	Theme: --col-bg-5	The background color when unchecked.
--hhl-switch-size	20	The size.
--comp-label-color	Theme	The label color.
--comp-label-font-size	Theme	The label fontSize.