Cup anemometer loader
The three cups of a weather station spin with the gusts while the wind speed reading rises and falls with them.
Settings
Code
<div class="uvq10-anm" role="status"><span class="sr">Loading</span><div class="wd" aria-hidden="true"><i style="--i:0"></i><i style="--i:1"></i><i style="--i:2"></i><i style="--i:3"></i><i style="--i:4"></i></div><div class="st" aria-hidden="true"><i class="ms"></i><div class="rot"><span class="arm" style="--i:0"><i class="cp"><b class="or"></b><b class="d"></b></i></span><span class="arm" style="--i:1"><i class="cp"><b class="or"></b><b class="d"></b></i></span><span class="arm" style="--i:2"><i class="cp"><b class="or"></b><b class="d"></b></i></span></div><i class="hb"></i></div><span class="ro" aria-hidden="true"><b></b> km/h</span></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Loaders
See all LoadersWhere to use it
A weather station anemometer in CSS 3D: three hemispherical cups on thin arms turn around a mast, fast during a gust and slower in the lull, while streaks of wind cross the scene. A small display counts the speed in km/h with a registered integer property kept in step with the spin. It suits weather apps, sailing and outdoor sports.
The main color paints the cups and the second the wind streaks. Show it while a forecast or live sensor data loads, and keep the reading if your product deals with real measurements.