Wireframe Forms

Heroes 39

About

A rotating 3D wireframe shape (cube, cylinders, or icosphere) rendered on an HTML canvas inside an isolated iframe, used as a decorative animated background or hero visual.

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

Code

How Wireframe Forms is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import WireframeForms from "@/components/ui/wireframe-forms";

export default function WireframeFormsCubeDemo() {
  return (
    <div className="flex h-[520px] w-full items-center justify-center overflow-hidden bg-[#050505]">
      <WireframeForms
        variant="cube"
        mode="dark"
        speed={3}
        size={1}
        length={1}
        density={1}
        opacity={1}
        hue={0}
        saturation={1}
        brightness={1}
      />
    </div>
  );
}