Webhook Widget

Example

Launch countdown

Five ways to display the same date.

timerstyles
Launch countdown
json
{
  "v": 1,
  "refresh": 900,
  "accessibility": "Launch in 2 hours 40 minutes",
  "view": {
    "type": "vstack",
    "align": "leading",
    "spacing": 6,
    "padding": 14,
    "bg": "#241014",
    "children": [
      {
        "type": "text",
        "text": "LAUNCH",
        "style": "caption2",
        "weight": "bold",
        "color": "#FF7A6B"
      },
      {
        "type": "timer",
        "until": "2026-08-11T11:20:00Z",
        "size": 26,
        "weight": "bold",
        "color": "white"
      },
      {"type": "divider"},
      {
        "type": "timer",
        "until": "2026-08-11T11:20:00Z",
        "style": "relative",
        "size": 12,
        "color": "#C99B95"
      },
      {
        "type": "timer",
        "until": "2026-08-11T11:20:00Z",
        "style": "offset",
        "size": 12,
        "color": "#C99B95"
      },
      {
        "type": "timer",
        "until": "2026-08-11T11:20:00Z",
        "style": "time",
        "size": 12,
        "color": "#C99B95"
      }
    ]
  }
}
Built for the small. The roomier sizes show the same payload with space to spare; a tighter slot gets its own tree from the server, not this one shrunk.

How it works

A timer node takes one date and a style that decides how it reads. All five keep updating on device between refreshes, which is why a countdown never needs a fast refresh interval.

timer counts down in minutes and seconds, relative says how far away it is in words, and offset shows a signed duration — negative while the date is still ahead, flipping positive once it passes, which is the system's convention. date and time simply format the instant, which is useful when the exact moment matters more than the distance to it.

Swap until for from when the date is in the past. They are the same field to the renderer; the two names just make the payload read correctly at the point you write it.

Put it on your Home Screen

This example is served live, with timestamps generated at the moment of the request. Add the URL as a hook in the app and it will work on a real phone.

URL
https://webhookwidget.com/demo/countdown

Open the raw response →

Next

Revenue, with a chart — A chart image alongside native text.
All examples