Time Picker UI With Changing Backgrounds For AM & PM

Image: Time Picker UI With Changing Backgrounds For AM & PM GIF

This simple user interface for time picker is designed by Josh Bivens. There are three vertical sliders that you can use to pick the hour, minute and AM/PM. When you switch between AM/PM the background colour changes providing a nice visual cue.

If you are having trouble with the pen, try the archived copy on GitHub

See the Pen Alarm Clock UI by Josh Bivens (@joshbivens) on CodePen.0

Posted by:Hima Vincent

Hima Vincent is the founder & editor in chief of CodeMyUI. She is a writer by day and a reader by night who helps web designers build awesome projects by sharing amazing code snippets for inspiration. Hobbies include designing, card games, photography and exploring the culinary arts.