Black Sea v0.1 — a plane displaced by a single image in three.js

One grayscale image does all the work here. It is loaded once and bound to a three.js MeshStandardMaterial three times over — as the displacement map, as the colour map and as the alpha map — so the same pixels that push a 1000 by 1000 segment plane out of flatness also tint it and decide where it disappears. The bright parts of the picture rise into a low relief, the dark parts stay at sea level and drop out through the alpha channel, and a dim hemisphere light is the only thing separating the shapes from the black background. OrbitControls with damping let you circle the surface and catch it at a grazing angle, where the relief reads best.

Source code: black-sea-v0.1 on GitHub. More work: all WebGL demos by Niccolò Fanton and Niccolò Fanton's portfolio.