50 mm
Camera lens with aperture
The front element of a 50 mm lens with multicoated reflections; pick an f-number and the iris blades close.
Settings
Code
<div class="uvq11-lens" style="--bk:.5"><div class="ln" aria-hidden="true"><svg class="tx" viewBox="0 0 200 200"><defs><path id="uvq11-lens-p" d="M100 100m-80 0a80 80 0 1 1 160 0a80 80 0 1 1-160 0"/></defs><text><textPath href="#uvq11-lens-p">AIMRAN · 50 mm · 1:1.4 · Ø58 · AIMRAN · 50 mm · 1:1.4 · Ø58 ·</textPath></text></svg><div class="gl"><svg class="ir" viewBox="-50 -50 100 100"><path class="bl" fill-rule="evenodd" d="M-50 0a50 50 0 1 0 100 0a50 50 0 1 0-100 0ZM22.50 13.34L3.60 25.91L-18.02 18.97L-26.07 -2.26L-14.49 -21.79L8.00 -24.91L24.46 -9.28Z"/><path class="ed" d="M22.50 13.34L-10.64 48.86M3.60 25.91L-44.83 22.15M-18.02 18.97L-45.26 -21.24M-26.07 -2.26L-11.62 -48.63M-14.49 -21.79L30.78 -39.40M8.00 -24.91L50.00 -0.50M24.46 -9.28L31.57 38.78"/></svg><i class="ct"></i><i class="r1"></i><i class="r2"></i><i class="r3"></i><i class="sb"></i></div></div><div class="pn"><p class="fm">50 mm</p><output class="fv">f/2.8</output><div class="vf" aria-hidden="true"><i style="--x:8%;--y:26%;--c:#ffd166;--z:1.08"></i><i style="--x:19%;--y:72%;--c:#ff6b6b;--z:1.18"></i><i style="--x:44%;--y:20%;--c:#7bdff2;--z:0.67"></i><i style="--x:43%;--y:46%;--c:#ffd166;--z:1.00"></i><i style="--x:48%;--y:36%;--c:#f7aef8;--z:0.89"></i><i style="--x:72%;--y:15%;--c:#b8f2e6;--z:0.64"></i><i style="--x:46%;--y:58%;--c:#ffe8a3;--z:1.05"></i><b></b></div><div class="ap" role="radiogroup" aria-label="Aperture"><label><input type="radio" name="uvq11-lens-ap" value="1.4"><span>f/1.4</span></label><label><input type="radio" name="uvq11-lens-ap" value="2"><span>f/2</span></label><label><input type="radio" name="uvq11-lens-ap" value="2.8" checked><span>f/2.8</span></label><label><input type="radio" name="uvq11-lens-ap" value="4"><span>f/4</span></label><label><input type="radio" name="uvq11-lens-ap" value="8"><span>f/8</span></label><label><input type="radio" name="uvq11-lens-ap" value="16"><span>f/16</span></label></div></div></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 Liquid Glass
See all Liquid GlassWhere to use it
A camera lens seen from the front: knurled focus ring, engraved markings on an SVG text path and a deep front element with purple and green coating reflections. A seven-blade iris drawn in SVG opens and closes smoothly, the reflections shift with the pointer, and a small viewfinder shows the bokeh shrinking as you stop down.
Use the two colors to tint the coatings and the selected chip. The f-stops are native radio buttons, so arrow keys work, and the block fits photography courses, camera shops or a settings panel with character.