Skip to content

WidgetCraftGet the app

iOS-style · Clock · 4 × 2 widget

iOS-style clock widget

By the WidgetCraft team · Updated November 13, 2026

An iOS-style clock widget shows the time in large numerals with the day and date beneath. Clean white cards, large bold figures and colored highlights. This page gives the exact colors, type settings and layers, with a preview drawn from the same values.

iOS-style clock widget design preview: Clean white cards, large bold figures and colored highlights. — Design preview drawn from the recipe below. Example values are shown; your widget uses live data.

What an iOS-style clock widget shows

A digital clock is the widget most people place first. It needs to be readable from arm's length, so the time takes most of the space and the date sits quietly below it.

It uses the phone's own time, so it needs no permission and works offline. WidgetCraft's clock layer follows your 12- or 24-hour setting unless you choose a format.

How the iOS-style style shapes it

This style follows the widgets people know from iPhones: white or dark rounded cards, a small colored title, a large bold number and tidy lists. It is a look, not an official Apple design.

Numbers: Use a heavy sans for the main number and a grey caption beside it.
Text: Put a small bold colored title in capitals at the top left, then the value in black.

iOS-style clock widget recipe

Layer	Settings
Canvas	360 × 180, background #FFFFFF, corner radius 26, soft shadow radius 12 at low opacity
Layout	split: the time on the left at size 64, a thin divider at x 236, and the weekday and date stacked in a column on the right
Text or Date	weekday, built-in Sans, size 12, color #8E8E93, capitals, letter spacing 0.1
Clock	format HH:mm, built-in Sans, weight 700, size 78, color #000000, left aligned
Date	day and month, size 15, color #8E8E93
Shape	small dot or rule in #FF3B30
Font	built-in Sans
Home screen size	4 × 2 cells

iOS-style color palette

White #FFFFFFBackground
System grey #F2F2F7Surface and tracks
Black #000000Text
Label grey #8E8E93Labels
Red #FF3B30Accent

How to make an iOS-style clock widget in WidgetCraft

Create a widget and open Canvas. Set the size to 360 × 180, the background to #FFFFFF and the corner radius to 26.
Tap Add and choose Clock. Set the format to hours and minutes, the font to built-in Sans, the size to 78 and the color to #000000.
Add a Date layer above it for the weekday at size 12 in #8E8E93, in capitals.
Add a second Date layer below for the day and month at size 15.
Add a small Shape in #FF3B30 as the only accent, and align every layer to the same left margin of 24.
Arrange the layers in the split layout: the time on the left at size 64, a thin divider at x 236, and the weekday and date stacked in a column on the right.
Tap Save, then Add to home screen and resize the widget on your launcher if needed.

Everything in this recipe works in the free version.

Tips for iOS-style clock widgets

Keep the card white and the radius around 26.
Use one bright color per widget as the title color.
Seconds make a home screen widget look busy and Android updates widgets about once a minute, so leave them out.
Check the widest time, such as 22:58 or 12:48 PM, so it never touches the edges.
If the launcher crops the widget, reduce the time size before reducing the margins.
Do not copy Apple artwork or icons.
Do not shrink margins below 16 points.

Questions about the iOS-style clock widget

What size is an iOS-style clock widget?

It is designed for 4 × 2 home screen cells on a 360 × 180 canvas. You can resize it on the launcher and the design scales in proportion.

Which colors does it use?

White (#FFFFFF) for the background, Black (#000000) for the main text, Label grey (#8E8E93) for labels and Red (#FF3B30) as the accent.

Is it free to make?

Yes. Clock widgets use free features in WidgetCraft, and the iOS-style styling is free too.

What else is this style called?

People also search for iphone style clock widget, ios widgets for android, apple style clock widget. They describe the same look as this iOS-style clock widget.

More iOS-style widgets

Clock widgets in other styles