Math Curve Loaders — A gallery of mathematical curve based loading animations built with plain HTML, CSS, and JavaScript.

A gallery of mathematical curve based loading animations built with plain HTML, CSS, and JavaScript.

Included Components

30
Original ThinkingThinking FiveThinking NineRose OrbitRose CurveRose TwoRose ThreeRose FourLissajous DriftLemniscate BloomHypotrochoid LoopThree-Petal SpiralFour-Petal SpiralFive-Petal SpiralSix-Petal SpiralButterfly PhaseCardioid GlowCardioid HeartHeart WaveSpiral SearchFourier FlowParticle Trail LoaderRose Curves (Rhodonea)Lissajous CurveHypotrochoid CurveCardioid LoopCassini OvalsFourier Epicycle PathInteractive Parameter SliderFormula Modal & Code Exporter

Math Curve Loaders transforms pure mathematics into expressive, hypnotic loading indicators. Using lightweight vector mathematics in vanilla JavaScript and Canvas/SVG, the project visualizes classical parametric curves—such as Rhodonea rose curves, Lissajous figures, hypotrochoids, cardioids, and Fourier-style epicyclic paths. Visitors can adjust mathematical frequency and damping parameters in real time and export production-ready code snippets with mathematical formula annotations.