# Lumen asset packs

> Twelve UI icons in frosted, halftone-printed glass, each with its own motion: an eye that watches, a lock that opens, a bell that rings. Five tints.

- [Lumen Pack](https://www.assembli.design/components/lumen-pack.md): The whole Lumen asset pack in one install: twelve UI icons in frosted, halftone-printed glass, raymarched in WebGL, each with its own motion: an eye that watches the cursor, a gear a wrench ratchets, a lock that swings open, a bell that rings. Five tints (ember, jade, iris, rose, ink) or your own colors, plus LumenTile and LumenTintPicker for building a board. All icons share one WebGL context.
- [Glass Bell](https://www.assembli.design/components/lumen-bell.md): Lumen pack asset: a notification bell in frosted, halftone-printed glass with a glass ball clapper. Every few seconds it rings: a damped swing about its hanger, with the clapper lagging behind and swinging wider. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Chat Bubble](https://www.assembli.design/components/lumen-chat.md): Lumen pack asset: a speech bubble in frosted, halftone-printed glass with three glass beads floating in front that hop in turn like a typing indicator. Raymarched in WebGL with refraction, so the beads read through the bubble's frosting. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Cube](https://www.assembli.design/components/lumen-cube.md): Lumen pack asset: a cube in frosted, halftone-printed glass that rolls a quarter turn at a time, overshooting and settling, so its gradient print comes round face by face. Raymarched in WebGL with refraction: the far edges show through the frosting. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Eye](https://www.assembli.design/components/lumen-eye.md): Lumen pack asset: an eye in frosted, halftone-printed glass. The almond lid has a hole cut through it and a thick pupil disc floats inside; it wanders, blinks every few seconds and turns to watch your cursor. Raymarched in WebGL with refraction, so you see the far edges through the glass. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Heart](https://www.assembli.design/components/lumen-heart.md): Lumen pack asset: a puffy heart in frosted, halftone-printed glass that beats in a lub-dub rhythm, swelling and glowing a little on each beat. Raymarched in WebGL with refraction and soft bevels. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Lightning Bolt](https://www.assembli.design/components/lumen-bolt.md): Lumen pack asset: a lightning bolt in frosted, halftone-printed glass. It winds up with a slow squash, then strikes: a sharp jolt with a little twist while the glass flashes bright and fades back. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Magnifier](https://www.assembli.design/components/lumen-search.md): Lumen pack asset: a magnifying glass in frosted, halftone-printed glass, with a thin lens set in the ring and a chunky handle. It sweeps a slow figure eight and leans into each turn, as if scanning a page. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Padlock](https://www.assembli.design/components/lumen-lock.md): Lumen pack asset: a padlock in frosted, halftone-printed glass with a keyhole cut clean through. The keyhole flashes, the shackle pops up and swings open about its leg in 3D, then swings back and drops shut with a bounce. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Pen Nib](https://www.assembli.design/components/lumen-pen.md): Lumen pack asset: a pen nib in frosted, halftone-printed glass, hovering over a separate base bar. Every few seconds it taps down: the bar squashes, the slit flexes open, and the nib springs back up. Raymarched in WebGL with refraction, so the slit and breather hole show their inner walls. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Plug](https://www.assembli.design/components/lumen-plug.md): Lumen pack asset: a connect icon in frosted, halftone-printed glass. A plug with two prongs and its socket half drift apart on a diagonal, then snap back together on a spring, and the seam lights up for a beat as they connect. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Resize Arrow](https://www.assembli.design/components/lumen-resize.md): Lumen pack asset: a diagonal resize arrow in frosted, halftone-printed glass. Its shaft stretches out on a springy ease, holds, then pulls back in, as if a corner were being dragged. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.
- [Glass Settings](https://www.assembli.design/components/lumen-settings.md): Lumen pack asset: a settings icon in frosted, halftone-printed glass. An eight-toothed gear with an open-ended wrench floating in front: the wrench pulls the gear round a tooth, then ratchets back on its own with a little overshoot. Raymarched in WebGL with refraction and bevel highlights. Five tints or your own colors. Zero dependencies; any number share one WebGL context.

Back to [asset packs](https://www.assembli.design/category/asset-packs.md).