Kedhareswer Naidu

Interactive Ink Shader Background

Shaders 21

About

Interactive WebGL ink shader background for React: crimson ink suspended in black and lit like anodized metal. Move the pointer to stir it and click to drop ink that rings outward; when idle the light drifts on its own. Raw WebGL2 with no three.js, React is the only import, and content sits on top as children.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Interactive Ink Shader Background to your project and fits it to your theme.

Code

How Interactive Ink Shader Background is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client"

import AnodizedInk from "@/components/ui/anodized-ink"

export default function Demo() {
  return <AnodizedInk />
}

More by Kedhareswer Naidu

View all
  • Glassmorphism Folder Cards

    Glassmorphism Folder Cards

    4.6K
  • Halftone Wordmark Footer

    Halftone Wordmark Footer

    2.1K
  • GitHub Contribution Graph 3D Heatmap

    GitHub Contribution Graph 3D Heatmap

    2K
  • Morph Gallery

    Morph Gallery

    1.8K
  • Food Menu Scroll Carousel

    Food Menu Scroll Carousel

    1.3K
  • Hanging Polaroid Image Carousel

    Hanging Polaroid Image Carousel

    1.2K
  • Animated Features Bento with Live Diagrams

    Animated Features Bento with Live Diagrams

    1.2K
  • Flipping Website Screenshot Deck

    Flipping Website Screenshot Deck

    805

More in Shaders

View all
  • Glass Fold

    Glass Fold

    435
  • Shader Animation

    Shader Animation

    3.8K
  • Illos Knowledge Sources

    Illos Knowledge Sources

    43
  • Phosphor 30

    Phosphor 30

    308
  • Wave

    Wave

    715
  • Black Hole

    Black Hole

    41
  • Warp Carousel

    Warp Carousel

    678
  • Illos Webhook Setup

    Illos Webhook Setup

    21