Interactive Code Cloth Physics Curtain

Interactive cloth physics text effect for React: a sheet of source code hangs from a rod as a verlet mesh on canvas, so every character bends, folds and drapes. Hover parts the code and scrambles the glyphs, drag to pull and flick it, double-click to pin or unpin, R to rehang and arrow keys for a gust. Reduced-motion aware.

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

"use client"

import CodeCurtain from "@/components/ui/code-curtain"

export default function Demo() {
  return (
    // w-full: 21st centres demos in a flex wrapper that would shrink this to 0px.
    <div className="relative w-full bg-[var(--color-background)]">
      <CodeCurtain />
    </div>
  )
}