Shader Background

Component that renders a full-screen WebGL canvas behind all other content. It compiles and executes custom vertex and fragment shaders to create an animated purple-blue plasma grid effect.

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

// This is file with demos of your component
// Each export is one usecase for your component

import ShaderBackground from "@/components/ui/shader-background";

const DemoOne = () => {
  return <ShaderBackground />;
};

export { DemoOne };