component
Ocean Hero 3D
By Lucas

Details
- LucasAuthor
- componentType
- $15.00Price
- 2026-08-14Published
- 2026-08-14Updated
- 2026-08-14Added
- SectionsCategories
Summary
A real FFT ocean with a live buoy
Description
A real ocean simulation - the same FFT wave spectrum used in games - running live in your hero. Three cascades of waves interfere, sharpen into crests and break into foam; a buoy rides the swell with genuine buoyancy, leaning into every wave. Drop in your own GLB model and it floats instead. Three scene styles, one click apart: Realistic (procedural sky with clouds and horizon haze), Super 8 (warm vintage film grade with fine grain and scratches), and Cartoon (true cel-shading with inked outlines and a saturated, storybook palette). The Simple panel drives the essentials - wind, wave height, foam, crest colour, sun and horizon. An Advanced panel opens the full engine: per-cascade FFT resolutions, choppiness, wind alignment, foam sharpness, cel tones. The physics runs in a Web Worker and the renderer adapts its resolution to keep any machine smooth. Three.js under the hood, everything procedural, nothing loaded from outside. Honours prefers-reduced-motion, and shows a still ocean frame on the Framer canvas.
Introduction
A real FFT ocean with a live buoy
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #4516