BREATHE · Calm Space

A breathing-focus page: a golden orb that rises and falls with your breath, three modes, and a todo list beside it.

Loading preview...

Start with this prompt

A breathing-focus page: a golden orb that rises and falls with your breath, three modes, and a todo list beside it.

Build a breathing-focus practice page. At the center, a golden orb swells and settles with the breathing rhythm like a slow visual metronome. Three modes are offered — 4-7-8 breathing, box breathing, and free breathing — and each session can run 1, 3, 6, or 10 rounds. While a session runs, the page shows the current phase (inhale, hold, or exhale) together with a live countdown, so you never have to count in your head. Four sliders — softness, turbulence, hue, and breath rate — reshape the orb's texture the moment you drag them, from a calm, smooth glow to a restless shimmer. On the right sits a todo list split into pending and completed, where finished tasks move over as you check them off, and adding a task asks for an estimated duration so the practice can fit the task. The whole page gradients from deep brown to warm gold. Single-file static page.

Tidal ambient sound

During a session, optional tidal ambient sound can play along with the orb's rise and fall; the phase display and countdown keep working exactly as before.

Try Websites Agent

Build a breathing-focus practice page. At the center, a golden orb swells and settles with the breathing rhythm like a slow visual metronome. Three modes are offered — 4-7-8 breathing, box breathing, and free breathing — and each session can run 1, 3, 6, or 10 rounds. While a session runs, the page shows the current phase (inhale, hold, or exhale) together with a live countdown, so you never have to count in your head. Four sliders — softness, turbulence, hue, and breath rate — reshape the orb's texture the moment you drag them, from a calm, smooth glow to a restless shimmer. On the right sits a todo list split into pending and completed, where finished tasks move over as you check them off, and adding a task asks for an estimated duration so the practice can fit the task. The whole page gradients from deep brown to warm gold. Single-file static page.

Forest-to-jade gradient theme

The breathing gradient across the page shifts from deep brown-to-warm-gold to deep forest green-to-jade; the orb, sliders, and todo list stay put.

Try Websites Agent

Build a breathing-focus practice page. At the center, a golden orb swells and settles with the breathing rhythm like a slow visual metronome. Three modes are offered — 4-7-8 breathing, box breathing, and free breathing — and each session can run 1, 3, 6, or 10 rounds. While a session runs, the page shows the current phase (inhale, hold, or exhale) together with a live countdown, so you never have to count in your head. Four sliders — softness, turbulence, hue, and breath rate — reshape the orb's texture the moment you drag them, from a calm, smooth glow to a restless shimmer. On the right sits a todo list split into pending and completed, where finished tasks move over as you check them off, and adding a task asks for an estimated duration so the practice can fit the task. The whole page gradients from deep brown to warm gold. Single-file static page.

Weekly focus statistics

Next to the todo list, a weekly focus-time summary is added, so returning users can see how much breathing practice they have done; task durations still work.

Try Websites Agent

Build a breathing-focus practice page. At the center, a golden orb swells and settles with the breathing rhythm like a slow visual metronome. Three modes are offered — 4-7-8 breathing, box breathing, and free breathing — and each session can run 1, 3, 6, or 10 rounds. While a session runs, the page shows the current phase (inhale, hold, or exhale) together with a live countdown, so you never have to count in your head. Four sliders — softness, turbulence, hue, and breath rate — reshape the orb's texture the moment you drag them, from a calm, smooth glow to a restless shimmer. On the right sits a todo list split into pending and completed, where finished tasks move over as you check them off, and adding a task asks for an estimated duration so the practice can fit the task. The whole page gradients from deep brown to warm gold. Single-file static page.