The tilt of the Earth's axis is 23.4 degrees. That one number controls the seasons, the midnight sun, polar night, and why Reykjavik and Singapore feel like different planets in December. I built a globe to make this visible.
Drag to spin it. Move the slider to change the day. Hover over any point to see its latitude and hours of daylight.
How the math works
The sun's declination changes throughout the year as Earth orbits. On the summer solstice the sun sits 23.4° north of the equator; on the winter solstice, 23.4° south. This tilt determines the hour angle of sunrise at any latitude:
function daylightHours(lat, day) {
var decl = TILT * Math.sin(TWO_PI * (day - 81) / 365);
var cosHA = -Math.tan(lat) * Math.tan(decl);
if (cosHA < -1) return 24; // midnight sun
if (cosHA > 1) return 0; // polar night
return (2 * Math.acos(cosHA) / TWO_PI) * 24;
}When the cosine of the hour angle drops below -1, the sun never sets. When it exceeds 1, the sun never rises. Between those extremes you get a smooth gradient from the equator's steady 12 hours to the poles' dramatic swings.
What to look for
Set the slider to late June. The Arctic Circle and everything north of it glows bright: 24 hours of continuous daylight. Antarctica is dark. Now drag the slider to December. The pattern inverts completely. At the equator, nothing changes. It stays locked at roughly 12 hours year-round.
The Tropics of Cancer and Capricorn (23.4° N/S) mark the latitudes where the sun is directly overhead at least once a year. The Arctic and Antarctic Circles (66.6° N/S) mark where you get at least one full day of midnight sun or polar night. Both lines appear as dashed circles on the globe.
Rendering
The globe draws on a standard HTML <canvas>.
Each frame it projects a grid of 4°×4° latitude-longitude
patches into screen space, colors them by daylight hours, and
shades them by depth to give a sense of curvature. Grid lines
and special latitude circles are drawn on top. The hover
crosshair uses inverse projection to convert screen coordinates
back to latitude and longitude.
No WebGL, no Three.js. Just 2D canvas and some trigonometry. It runs at 60fps on any modern device.