Lofi Skylines

Tokyo

Neon rain in Shinjuku

--:-- local time 1 here now · all night
Press play for 30 generated tracks 30 tracks · lo-fi · deep focus · focused EDM

City selector

Where to tonight?

Fourteen hand-built pixel cities. Click the city chip to cycle, or press C to choose one.

Library

30 tracks for the night

    Ten lo-fi, ten deep-focus and ten focused-EDM tracks. All generated live in your browser; the next track stays in the same mood.

    Up next

    Coming through the night

      Next and auto-advance stay in the current mood.

      Focus timer

      One small stretch of night

      25:00

      The timer keeps running while you switch cities. A soft chime will play when it ends.

      Shortcuts

      Move around the night

      Space
      Play or pause
      N
      Next track
      C
      Choose a city
      W
      Change weather
      V
      Open the 30-track library
      T
      Focus timer
      F
      Fullscreen
      M
      Mute / unmute
      A
      Weather & city sounds
      1–9, 0
      Jump to the first ten cities
      ← →
      Previous / next city
      ?
      This panel

      Rain, wind and clear-night crickets follow the weather. Try Tokyo in snow.

      City guide

      Tokyo, after rain

      Open in maps

      About

      A small, free corner of the night

      Lofi Skylines is a free, open-source web app: animated pixel-art cities with 30 generated tracks across lo-fi, deep focus and focused EDM. Every track is composed live in your browser. No account, no downloads, no ads.

      Every scene is drawn on a 480 × 270 canvas, one pixel at a time. The music is synthesized with the Web Audio API; rain and storms use a recorded rain-thunder loop, while the other weather beds are synthesized live. There are 30 tracks across lo-fi, deep focus and focused EDM; the queue moves on by itself when a track ends, or press Next to skip ahead.

      Built as a minimal tribute to Lofi Cities. The code is MIT licensed. Add your own city by editing js/cities.js and js/scenes.js. Thunder sample: “Thunder Strike” by Universfield via Pixabay. Rain ambience and background thunder: “Rain & Thunder” by SoundReality via Pixabay.

      View source Visit the original Lofi Cities

      Support the project

      If Lofi Skylines helps you focus, you can keep the night running:

      Buy me a coffee Sponsor on GitHub

      Made with plain HTML, CSS, Canvas and Web Audio. Hosted for free on Cloudflare.