twc-009 / A study by Syafril · not client work
Look through clear glass panes at four original sculpture renders. Search and collect studies, switch clear/frosted/smoked presets, then adjust diffusion and tint. Copy or download the material CSS.
#102d36#f0f6ed#91bdc4#e5c18bWHAT IS HERE / WHAT COMES NEXT
Digital exhibitions, material explorers and visual collections.
This tool includes a working workspace and its own component book. Its controls operate on local state.
Exports are generated in your browser. No account, cloud storage or external service is connected.
Sculptures are pre-rendered images, not live 3D. Saved choices live only in the open page; browser support determines blur rendering and unsupported contexts retain solid panels.
Page scope, brand assets, content, handover, hosting, costs and support are discussed in a consultation before work begins. The demo is a reference for that conversation.
Prepare a brief for this directionThe sculpture remains visible outside the pane and diffuses as it passes behind it. Thin reflections, layered shadows and a small tint make glass a visible material rather than an opaque container.
A full-bleed optical sculpture, marine shadows, glacier text and amber highlights. Clear panes have a reflective rim and restrained surface tint; they carry the gallery rather than hiding its backdrop.
Syne, drawn for a Paris art centre, gives the gallery titles a wide, fluid voice. DM Sans reads the text and small mono metadata leaves artwork in the foreground.
An object-led composition: a compact introduction and material desk sit beside a larger clear gallery window. Four small study thumbnails leave room to see the sculpture through the pane. The window precedes material tools on mobile.
Background drift is off by default, explicitly toggleable and suppressed by reduced motion. Selecting a study changes the original rendered backdrop and keeps all material controls mounted.
Original layered CSS glass uses bounded 12–48% tint, diffusion, controlled backdrop brightness and an opaque fallback. The rendered and exported material share a contract. Sculptures are generated offline with Three.js and served as responsive WebP; the gallery loads no 3D engine. No Glass3D code or texture is copied.
Backdrop brightness is bounded so the clear surface keeps readable text across every tint setting. Presets, search, filter, saved state and ranges are labeled; solid mode and reduced motion remain explicit alternatives.
Build a small woodland scene from real Kitbitz illustrations.
A product you can turn, recolor and illuminate.