---
title: "Liquid Glass Cursor — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Rashid Iqbal · Cursors. Liquid Glass Cursor for Framer adds a macOS-style refractive glass cursor to any Framer website."
canonical: "https://framer.elliotli.dev/component/liquid-glass-cursor"
---

[Home](/)/[Components](/components)/[Cursors](/components/category/cursors)/Liquid Glass Cursor

# Liquid Glass Cursor

Liquid glass that bends pixels

[View on Framer](https://framer.com/marketplace/components/liquid-glass-cursor/?via=elliot-li)

![Liquid Glass Cursor preview image 1](https://framer.elliotli.dev/og/component/liquid-glass-cursor/08d309daf6f65fb3/1600x1200.jpg)

## Summary

Liquid Glass Cursor for Framer adds a macOS-style refractive glass cursor to any Framer website.

## Description

**Liquid Glass Cursor for Framer** adds a macOS-style refractive glass cursor to any Framer website. It bends, magnifies, blurs, and lights the pixels beneath the pointer, so text, images, cards, gradients, and backgrounds react as you move.

**Key Features:**

-   **Real Pixel Refraction:** Distorts live page content beneath the cursor using SVG displacement and `backdrop-filter`.
    
-   **macOS-Inspired Glass:** Combines refraction, magnification, blur, tint, edge lighting, highlights, chromatic dispersion, and shadow.
    
-   **Live Settings UI:** Tune the effect on your preview or published site and see changes instantly.
    
-   **Copy & Paste JSON:** Export your setup, paste it into the **Config JSON** prop, or download it as a `.json` preset.
    
-   **Framer Controls:** Adjust size, hover size, follow speed, stretch, thickness, refraction, blur, tint, lighting, shadows, pointer dot, and more.
    
-   **Hover Morphing:** Expands over links, buttons, inputs, or custom selectors with smooth deformation and click compression.
    
-   **Adaptive Glass:** Increase optical strength as the cursor grows for a thicker lens feel.
    
-   **Built-In Presets:** Start with Regular, Clear, or Shader-style glass.
    
-   **Browser Fallback:** Chromium gets full displacement; unsupported browsers fall back to layered blur and glass styling.
    
-   **No Plugins Required:** Add the component, configure it, and publish.
    

**Use Cases:**

-   Portfolios and agency websites
    
-   SaaS and product landing pages
    
-   Experimental and macOS-inspired interfaces
    
-   Product launches and visual campaigns
    

### Browser Support

For the strongest live refraction, use **Chrome or Edge**. Other browsers automatically use the glass fallback.

### Refund Policy

Due to the nature of digital products, all sales are final.

**Exceptions:**

1.  **Technical Defects:** The component is defective and our support team cannot resolve it.
    
2.  **Duplicate Purchase:** You accidentally purchased the same item twice.
    

Please contact us for support before requesting a refund.

## Rank history [How rankings work →](/terms#rankings)

-   All · #8681

## Details

- **Author**: Rashid Iqbal
- **Price**: $4.00
- **Published**: 2026-08-29
- **Updated**: 2026-09-20
- **Added**: 2026-08-29
- **Categories**: Cursors

## More like this

-   [Ribbon Hero](/component/ribbon-hero) — Divyesh WebCraft · Free — 3D ribbon with smooth motion
-   [Spider Hunt](/component/spider-hunt) — Karim Saif · $6 — ٍpider that tracks your cursor
-   [Pixel Fluid](/component/pixel-fluid) — Jamik · $12 — Fluid cursor trail in pixels/ASCII
-   [CursorImageTrail](/component/cursorimagetrail) — princeee · $20 — Image Trail is a dynamic Framer component that creates an immersive hover experience by displaying a sequence of images that trail behind…
