TimeSelector Add-on | Vaadin

Time selection add-on

TimeSelector is a component that enables simple selection of the time using a circle. All parts except for the circle selector can be themed using css to get the look and feel that one needs.

The circle selector is supports both desktops and mobiles.


Link to this version
BetaReleased 27 December 2021Apache License 2.0
Framework Support
Vaadin platform 14+
Also supported:
Vaadin 7 (1.2.1)Vaadin 8 (2.0.1)
Browser Compatibility
Install with
Release notes - Version 14.0.0-beta1

Updated version of the TimeSelector add-on component for v14.8+

Beta1 adds only basic 24h feature for the TimeSelector.

CircleSelector new feature from older versions is:

Colors can be themed with css, for instance using the element API:

final Style style = circleSelect.getElement().getStyle();
style.set("--circle-inside", "GhostWhite");
style.set("--circle-selector", "Indigo");
style.set("--circle-selector-dot", "RebeccaPurple");
style.set("--circle-text", "SpringGreen");