Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Multicolored Clock

Public visualization

Viewing a saved revision (read-only)

30a82f0740e04f46b93dc32ea0288e4c

Multicolored Clock

0 stars1🌍 Public
MManinder Singh
Last edited May 5, 2020
Created on May 5, 2020
Forked from HTML Starter

The Multicolored Clock visualizes time as a nested set of seven animated arc segments, each representing seconds, minutes, hours, day, date, month, and a static credit ring. The arcs smoothly transition every second using elastic easing, with colors interpolating across an HSL spectrum based on each unit’s current value via a linear scale. Built with D3 v3, it uses `d3.svg.arc`, `attrTween` for value interpolation, and `textPath` to label each ring. Data is generated live from the JavaScript `Date` object, rendered as SVG with continuous animation.

AI-generated description