Hacemos webs rápidas, bonitas, accesibles y tuyas
3D cube word rotator
The last word of the headline sits on the faces of a cube that turns to show a different word each time.
Settings
Code
<h3 class="uv-twq"><span class="a">We build sites</span> <span class="cb" aria-hidden="true"><i>fast</i><i>beautiful</i><i>accessible</i><i>yours</i><span class="in"><b style="--i:0">fast</b><b style="--i:1">beautiful</b><b style="--i:2">accessible</b><b style="--i:3">yours</b></span></span><span class="sr">fast, beautiful, accessible and yours</span></h3>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 Text & scroll
See all Text & scrollWhere to use it
A headline whose final word changes by rotating a small 3D cube. Each face carries one word on a colored gradient, and the cube pauses on every face before tumbling to the next with a snappy ease, so the sentence keeps completing itself in four different ways without any layout jump.
The cube width adapts to the longest word through a hidden grid sizer, so translations never overflow. Screen readers hear the full list once, the animation is pure CSS and reduced motion stops it. Edit the words, both colors and the speed.