DayNight

Is it light or dark where your user is? Find out without asking them, in 6.9 KB.

You, right now

…and everyone else

Every timezone the library knows, lit by the brightness it reports for it. Spin the globe to any side, or click the thumbnail for the flat map β€” the same zones either way. Drag the slider and the line between day and night moves, drawn by daynight() alone, one call per dot, recomputed for every frame.

How it works

  1. Ask the browser for its timezone. Intl.DateTimeFormat().resolvedOptions().timeZone returns something like Europe/Madrid. No prompt, no permission, no network.
  2. Look up the centre of that zone. A table of 418 zones, computed from real timezone boundaries and quantised to tenths of a degree to stay small.
  3. Work out the sun from there. Sunrise and sunset for those coordinates and that date, then whether the given moment falls between them.

So the answer is an estimate for the middle of a timezone, not for a person. That is the trade: no geolocation prompt, no IP lookup, no third-party request β€” in exchange for being approximate at the edges of a zone.

The call being made right now

This tracks the slider, and follows whichever dot you point at.

API

npm install daynight
daynight(options?) returns:
theme 'day' | 'night' Ready to put on an element as a class.
light / dark boolean Whether the sun is above or below the horizon.
brightness number 0 to 1, exactly 0.5 at sunrise and at sunset.
sunrise / sunset Date Estimated, for the centre of the zone.
polar 'day' | 'night' | null Midnight sun or polar night, when there is no sunrise or sunset to report.
timezone string The zone used β€” the current name, if the one you passed has been renamed.
coordinates [number, number] Longitude and latitude of the zone's centre.

Both options are optional: timezone defaults to the browser's own, date to now. Pass either to ask about somewhere else, or some other time β€” which is all this page is doing.