component
Mascot 3D
By Visual Mess Studio
Details
- Visual Mess StudioAuthor
- componentType
- $10.00Price
- 2026-03-17Published
- 2026-08-22Updated
- 2026-03-08Added
- EffectsCategories
Summary
Mascot 3D lets you showcase a photo inside a translucent, reflective 3D object, with multiple shape options (square, circle, oval, heart, hexagon, octagon).
Description
Mascot 3D lets you showcase a photo inside a translucent, reflective 3D object, with multiple shape options (square, circle, oval, heart, hexagon, octagon). You can customize the scene background, switch HDR environments to change the reflection style, and fine-tune the glass look with tint, refraction (IOR), and opacity. It also includes built-in animation controls for a continuous spin or a subtle swing, with optional X and Z motion for extra depth. If you want it to be interactive, enable Orbit controls so users can smoothly drag and explore the mascot in real time. Framer 3.0 Compatibility Framer 3.0 no longer supports loading external .hdr environment files at runtime. To make Mascot 3D fully compatible, the included HDR environments have been converted to JPEG using a gainmap workflow. Ready-to-use HDR environments: https://drive.google.com/drive/folders/1s1nG5trSU0vk3QSbpMvTwjf3JrzZWAWc?usp=sharing Want to use your own HDRI? Download an HDRI from Poly Haven . Convert the .hdr to JPEG using the free Gainmap Creator . Download the converted JPEG. Upload it directly into the Mascot 3D component. Inspired by the beautiful experiments from sabosugi (thank you for the inspiration) - https://codepen.io/sabosugi
Introduction
Customizable 3D glass mascot
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #2152