New to Kendo UI for Angular? Start a free 30-day trial
Keyboard Navigation
The keyboard navigation of the ColorPicker is always available.
The ColorPicker supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Down Arrow & Enter | Opens the popup, when the ColorPicker element is focused. |
Escape | Closes the popup. |
Tab | Moves the focus sequentially through the elements inside of the popup. If the popup is closed, the focus will be moved to the next element on the page. |
Shift + Tab | Moves the focus sequentially in reversed order through the elements inside of the popup. If the popup is closed, the focus will be moved to the previous element on the page. |
Right Arrow | Focuses the next cell on the right when palette view is enabled and the ColorPalette element is focused. |
Left Arrow | Focuses the next cell on the left when palette view is enabled and the ColorPalette element is focused. |
Up Arrow | Focuses the next cell above when palette view is enabled and the ColorPalette element is focused. |
Down Arrow | Focuses the next cell below when palette view is enabled and the ColorPalette element is focused. |
Enter | Selects the color when palette view is enabled and the ColorPalette element is focused. |
The following example demonstrates the ColorPicker keyboard navigation.
Example
View Source
Edit In Stackblitz
Change Theme:
