Custom Component

Custom Component

01 Jan, 2026

Liquid metal icon

A premium WebGL-powered icon ring with a liquid metal shader effect. Fully customizable size, stroke, colors, and icon SVG, designed for modern, high-end interfaces.

A premium WebGL-powered icon ring with a liquid metal shader effect. Fully customizable size, stroke, colors, and icon SVG, designed for modern, high-end interfaces.

About

The Liquid Metal Icon Ring is a customizable icon component with a smooth liquid metal visual effect, powered by WebGL. It’s designed to add a premium and modern look to your website or interface.


You can adjust the overall size, ring stroke thickness, inner colors, and icon size. The component also supports custom single-color SVG icons, so you can easily use your own icons inside the ring.


If you want to make it clickable or navigate to another page, simply wrap this component inside a frame or stack and add your interaction or link there.


This makes the component flexible and easy to use in buttons, call-to-action sections, feature highlights, or decorative UI elements.

Icon customization

Features

  1. Liquid metal WebGL ring effect for premium visuals

  2. Customizable size, stroke width, and icon scaling

  3. Supports custom single-color SVG icons

  4. Easy to integrate with Framer Frames and interactions

Interaction

Profile fluid

Interaction

Profile fluid

Interaction

Profile fluid

Interaction

Profile fluid

3D Image hover

3D Image hover

3D Image hover

3D Image hover

Open for new opportunities

Let's build something

meaningful together.

Created by Vipin

© 2026

  • design.vipinkrish2011@gmail.com

  • design.vipinkrish2011@gmail.com

  • design.vipinkrish2011@gmail.com

Create a free website with Framer, the website builder loved by startups, designers and agencies.