HTML + CSSToggles
Waking sunflower toggle
When the sun comes out, the sunflower lifts its drooping head and opens its petals one after another.
Settings
16px
1x
Code
<label class="uvq03-snf"><input type="checkbox" role="switch"><span class="gd"><i class="sn"></i><i class="st"></i><i class="lf a"></i><i class="lf b"></i><span class="hd"><i class="pt" style="--i:0"></i><i class="pt" style="--i:1"></i><i class="pt" style="--i:2"></i><i class="pt" style="--i:3"></i><i class="pt" style="--i:4"></i><i class="pt" style="--i:5"></i><i class="pt" style="--i:6"></i><i class="pt" style="--i:7"></i><i class="pt" style="--i:8"></i><i class="pt" style="--i:9"></i><i class="pt" style="--i:10"></i><i class="pt" style="--i:11"></i><i class="cn"></i></span></span>Solar mode</label>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 Toggles
See all TogglesWhere to use it
This switch is a sunflower on a tall stem with two leaves, drooping and dull when off. Turning it on brings the sun up in the corner, the head lifts with a springy swing towards it, the colours warm up and twelve petals open one by one around the seeded centre. It suits solar energy apps, daylight modes and gardening sites.
The main color is the petals and the second one is the sun. Deep gold with a red sun gives a late summer look, pale lemon a spring one. A label about the sun or energy fits it best.