Getting Started
Documentation
Components
Form
Layout
Navigation
Charts
Tools
Directives
ActiveZone
Animated
Appearance
AutoFocus
CopyProcessor
DateFormat
ElasticSticky
Element
Fade
FluidTypography
Highlight
HoveredChange
Media
NumberFormat
Pan
Present
Resizer
Ripple
Sensitive
Shimmer
Skeleton
Swipe
TextfieldController
Theme
Touchable
Truncate
Validator
ValueChanges
Zoom
Pipes
Amount
Currency
Emails
FilterByInput
Filters an array
Flag
FormatNumber
Mapper
Obfuscate
Stringify
StringifyContent
Services
KeyboardService
Utils
DOM
Format
Math
Miscellaneous
Tokens
Taiga UI 5.0 is out!
See
what's new
Appearance
CORE
Examples
API
GitHub
On this page
Basic
Custom
Checkbox
Bundled
A directive for visual presets of interactive components
Basic
Interactive elements react to pointer natively but you can override state with inputs
Preview
HTML
LESS
Non-interactive elements do not react to pointer
Hovered state is only triggered on devices with pointer
Triggering state manually
Custom
Use LESS or SCSS mixins to create your own appearances in global styles
Preview
HTML
LESS
SCSS mixins have the same names
Checkbox
You can use it on input[type="checkbox"] to create a custom toggle component easily
Preview
HTML
LESS
Bundled
You can create your own appearances or use one of the bundled options
Preview
HTML
LESS
Primary
primary
primary-destructive
primary-grayscale
Secondary
secondary
secondary-destructive
secondary-grayscale
Flat
flat
flat-destructive
flat-grayscale
Outline
outline
outline-destructive
outline-grayscale
Action
action
action-destructive
action-grayscale
Status
neutral
negative
positive
warning
info
Others
icon
floating
textfield
accent
Taiga UI
v5.1.0
GitHub
StackBlitz
Settings