Tidal
The whole site breathes at six breaths a minute.
Or by email, or with the form. We send you the files and the licence.
The signature
Breath
A breathing cycle written to one CSS variable, with a pause button, adjustable timings (for example 4-4-4 box breathing) and a still version for reduced motion.
The idea
One slow breath, five seconds in and five out, drives a single CSS variable. Only the elements that read it move: the hero disc, the brand dot, the tide line, the giant word and the footer; the rest of the page stays still.
Signature moments
- 01
A one-minute exercise on the home page: six guided breaths with a countdown, then an invitation to a free first call.
- 02
On the approach page a giant word switches between breathing in and out, changing width and weight, while a tide line rises and falls.
- 03
A visible crisis notice with Spain's 024 suicide helpline, on the home page and in the footer.
All 17 pages
Try it here
