Implementing the Syncfusion WinForms Clock Control

The Syncfusion Clock control (Syncfusion.Windows.Forms.Tools.Clock) is a display-only control that shows the current time as either an analog or digital clock. It supports extensive visual customization — hand colors and thickness, gradient backgrounds, frames and shapes for digital mode, transparency, and a fully replaceable rendering pipeline.

When to Use This Skill

Use this skill when you need to:

• Add a clock display (analog or digital) to a WinForms form
• Switch between analog and digital modes via ClockType
• Customize colors — gradient background, hand colors, border, minute lines
• Configure digital clock frames or shapes — ClockFrame, ClockShape
• Show a fixed or custom time — ShowCustomTimeClock + CustomTime
• Freeze the clock at a specific time — StopTimer
• Apply a custom renderer — override ClockRenderer.DrawInterior or DigitalClockRenderer.DrawDigitalClockFrame

Component Overview

Documentation and Navigation Guide

Getting Started

📄 Read: [references/getting-started.md](references/getting-started.md)

• Assembly references and NuGet package setup
• Adding Clock via designer or programmatically
• Switching between analog and digital modes (ClockType)
• Displaying a fixed or custom time (ShowCustomTimeClock, CustomTime)
• Freezing the clock (StopTimer)

Appearance and Color Customization

📄 Read: [references/appearance-and-color.md](references/appearance-and-color.md)

• Gradient background colors (StartGradientBackColor, EndGradientBackColor)
• Hand colors (HourHandColor, MinuteHandColor, SecondHandColor)
• Minute line and border colors (MinuteColor, BorderColor)
• Hand thickness (HourHandThickness, MinuteHandThickness, SecondHandThickness, MinuteThickness)
• Show/hide toggles (ShowAMorPM, ShowBorder, ShowMinute, ShowSecondHand)
• Transparent background (IsTransparent)

Digital Clock

📄 Read: [references/digital-clock.md](references/digital-clock.md)

• Enabling digital mode
• Frames vs shapes — mutually exclusive; use ShowClockFrame to switch
• ClockFrame values: RectangularFrame, CircularFrame, SquareFrame
• ClockShape values: Rectangle, RoundedRectangle, Circle, Square, RoundedSquare
• Color customization: ForeColor, BackgroundColor, BorderColor
• Behavior: DisplayDates, ShowHourDesignator
• Custom time in digital mode
• Custom digital frame renderer (DigitalRenderer)

Custom Renderer (Analog)

📄 Read: [references/custom-renderer.md](references/custom-renderer.md)

• Subclassing ClockRenderer and overriding DrawInterior
• sender values: "SecondsHand", "MinutesHand", "HoursHand", minute lines (else)
• Customizing pens with LineCap, DashStyle
• Assigning the renderer to the clock

Quick Start

C# — Analog clock, programmatic:

using Syncfusion.Windows.Forms.Tools;

Clock clock1 = new Clock();
clock1.ClockType = ClockTypes.Analog;
clock1.StartGradientBackColor = Color.Black;
clock1.HourHandColor = Color.SkyBlue;
clock1.MinuteHandColor = Color.LightSeaGreen;
clock1.SecondHandColor = Color.LightSteelBlue;
this.Controls.Add(clock1);

VB.NET — Digital clock:

Imports Syncfusion.Windows.Forms.Tools

Dim clock1 As New Clock()
clock1.ClockType = ClockTypes.Digital
clock1.ShowClockFrame = True
clock1.ClockFrame = ClockFrames.RectangularFrame
Me.Controls.Add(clock1)

Common Use Cases