# Introduction

The hhl-checkbox 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"
The syntax for colorValue is backgroundColor/color eg red/white.

# 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-checkbox-bgcolor	Theme: --col-txt-on-pri	The background color when checked.
--hhl-checkbox-color	Theme: --col-pri	The color of the check mark.
--hhl-checkbox-size	20	The size.
--comp-label-color	Theme	The label color.
--comp-label-font-size	Theme	The label fontSize.
--comp-border-color	Theme	The borderColor when not checked.