Camera shutter button
Six aperture blades close over a blue-coated lens when you press, and the frame counter drops by one.
Settings
Code
<button class="uvq01-sht" type="button"><span class="ln" aria-hidden="true"><span class="gl"></span><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><i style="--i:5"></i></span><span class="t">Take photo</span><span class="ct" aria-hidden="true"><b>36</b></span></button>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 Buttons
See all ButtonsWhere to use it
Built like the top plate of a film camera, this pill has a lens framed by a thin red ring, six CSS aperture blades and a small LCD frame counter. Hovering stops the iris down, pressing closes it completely with a quick flash, and every shot takes one frame off the roll. Great for photo apps, booking a shoot or upload buttons.
The main color tints the lens ring and the secondary color sets the lens coating, so a Leica red or another brand accent is one change away. Keep the label short and verb based, such as Take photo or Scan.